jquery - 如何在 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;
}

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;
}