什么是在网页中动态更改HTML5视频的宽度和高度的最佳方法？我所指的行为类型与http://flipboard.com/介绍视频中的相同行为一样。当窗口大小调整时，视频仍然占据100％的可视大小（无需滚动）。我注意到视频被调整大小到一定程度，但在某些点上停止调整大小并被裁剪。如何获得相同的行为？我想让视频占据浏览器的整个可视区域而没有滚动条。这仅适用于桌面/笔记本电脑，我目前不考虑任何移动设备。我现在想到的是使用JavaScript动态更改视频的宽度/高度属性以适应可视区域，但也设置一个最小尺寸，使视频不会变形。视频可以放置在始终居中的容器中，因此如果浏览器变得太小，则会有效地被裁剪。我不确定这是否过于冗长，是否有更简单的方法。谢谢。
2个回答
0
看起来他们将高度和宽度的css属性设置为100%。如果您使用像Chrome内置的元素检查器或Firefox的Firebug这样的元素检查器，您应该能够准确地看到他们如何构建video元素以及嵌套在其中的div的html/css。然后，就像您所说的那样，还要设置min-width/min-height属性。
除非我误读了您的问题，否则应该很简单。希望这可以帮助您！
- shanabus
0
你可以使用“响应式CSS”来实现，有几种方法可以做到这一点，
你可以设置 viewport、max-width、min-width 等等。
这个链接有一个很好的解释如何做到这一点: http://kyleschaeffer.com/best-practices/responsive-layouts-using-css-media-queries/
- Alfian Busyro
网页内容由stack overflow 提供, 点击上面的可以查看英文原文，
原文链接
原文链接