宽度为100％的视频和自定义高度：

Question

我正在尝试将视频设置为100％宽度但不是100％高度，而是需要设置自定义高度。

我的HTML：

<div id="video-player">
   <video width="1905px" height="800" autoplay >
      <source src="video/earth.mp4" type="video/mp4">
   </video>
</div>

我的CSS：

video {
  width: 1905px    !important;
  height: 800px   !important;

}

它设置了100％宽度，但它也设置了100％高度超过我需要的高度。

任何解决方案？

Answer 1

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

Answer 2

首先，从视频开启标记中删除width和height属性。现在用css写，

video{
 width:100%;
}

这适用于所有设备，包括手机和标签。