videogular 裁剪视频而不是调整大小

Question

我有一个原始尺寸为 1920x1080 的视频。我正在使用基本设置教程中的 css，但尝试将 css 中的默认高度设置为 1080：

.videogular-container {
    width: 100%;
    height: 1080px;
    margin: auto;
    overflow: hidden;
}

@media (min-width: 1200px) {
    .videogular-container {
        width: 1170px;
        height: 658.125px;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .videogular-container {
        width: 940px;
        height: 528.75px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .videogular-container {
        width: 728px;
        height: 409.5px;
    }
}

这似乎是溢出问题 - 它只是隐藏了视频的其余部分，而不是实际调整它的大小。

我在配置中设置了这个：

width: 1920,
 height: 1080,      
 responsive: true,

我做错了什么？

Answer 1

这与答案有关

您需要为 Videogular 主题设置正确的 url。

Answer 2

这对我有帮助。把它放在视频所在的 CSS 文件中即可。

video {
  width: 100% !important;
  height: auto !important;
}

显示为 FLEX

videogular 裁剪视频而不是调整大小

videogular crops video rather than resizing

javascript

css

angularjs

videogular