如何使用 html 中的视频标签使视频响应？答案

【问题标题】：How to make video responsive using video tag in html?如何使用 html 中的视频标签使视频响应？
【发布时间】：2018-03-22 08:47:28
【问题描述】：

我想让视频在 html 中响应。为此，我正在使用视频标签。以下是我尝试过的代码。

<video controls autoplay="true" loop class="video_travel">
    <source src="video/video.mp4" type="video/mp4">
    <source src="video/video.webm" type="video/webm">
    <source src="video/video.ogv" type="video/ogg">
</video>

现在当我在手机中打开包含视频的网站时，我得到的是一个播放按钮，但无法播放任何东西。请帮忙..

【问题讨论】：

标签： javascript html css html5-video

【解决方案1】：

使用 Css 属性-

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

【讨论】：

【解决方案2】：

你可以在下面使用“max-width:100%”检查sn-p..

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

<video controls autoplay loop class="video_travel">
    <source src="http://clips.vorwaerts-gmbh.de/VfE_html5.mp4" type="video/mp4" />
    <source src="http://clips.vorwaerts-gmbh.de/VfE.webm" type="video/webm" />
    <source src="http://clips.vorwaerts-gmbh.de/VfE.ogv" type="video/ogg"  />
</video>

【讨论】：

是的，现在试过了，我可以播放视频，但不能自动播放。

【解决方案3】：

你试过了吗

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

【讨论】：