如何在 html css 中更改视频的高度？

Question

每当我更改视频的高度时，我都必须在我的页面上显示 100% 宽度和 400px 或 500px 高度的视频，它也会更改我不想要的宽度。而且我还必须显示全屏视频移动设备。

请在这方面帮助我..

 <div class="video-size">
<video  autoplay loop controls muted>
  <source src="http://techslides.com/demos/sample-videos/small.mp4" type="video/mp4">
</video>
</div>

CSS

 .video-size
{
  width: 100%;
  height: 400px;
}

原文由 user6930268 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

希望这将解决纵横比问题。

HTML:

 <video autoplay muted loop id="myVideo">
    <source src="videos/Raindrops.mp4" type="video/MP4">
</video>

CSS：

 #myVideo {
    width: 100%;
    height: 600px;
    object-fit: cover;
    z-index: -100;
}

原文由 Aadol Rrashid 发布，翻译遵循 CC BY-SA 4.0 许可协议