我正在努力让我的视频成为响应式视频。视频位于图像(电视屏幕)的顶部,无论浏览器有多大,它都必须保持在同一个位置。
我如何制作视频以便
a)回应 b)固定在当前所处的位置。
视频有高度和宽度,所以我猜它很难做到。
任何建议都将受到赞赏。
由于
里斯
{{1}}
答案 0 :(得分:2)
制作视频响应与制作图片响应非常相似。 主要是,您有两个解决方案:
1)在%s中使用width和max-width属性而不是像素。 视频将在他的范围内缩放(当然也在窗口限制范围内)。 这是一个非常常见的解决方案 - 但是,我建议您不要使用它。 在与视频不同的宽高比的屏幕上,这可能看起来不太好。 http://www.w3schools.com/css/css_rwd_videos.asp
2)更好的解决方案是使用媒体属性作为源,根据不同的屏幕尺寸(媒体查询)调整不同的视频。
<video>
<source src="video-widescreens" media="screen and (min-width:800px)">
<source src="video-widescreens" media="screen and (min-width:800px)">
<source src="video-smallscreens.mp4" media="screen and (max-width:799px)">
<source src="video-smallscreens" media="screen and (max-width:799px)">
</video>