核心知识
响应式媒体尺寸
容器变窄时，视频随之缩小，不超出容器；高度按原比例调整。
- 容器：包住视频的父元素，例如下面的
div。 max-width: 100%：显示宽度不超过父容器的内容宽度。height: auto：高度随宽度按原比例调整，避免拉伸。- 本片原始尺寸为 720 × 480，宽高比是 3:2
<div style="width: 400px;">
<video controls width="640"
src="demo/huangmei-opera.mp4"></video>
</div>
<style>
video { display: block; max-width: 100%; height: auto; }
</style>限制最大宽度，不等于始终撑满
保留 width="640"，只设置 max-width: 100%; height: auto; 时，容器宽 800px，视频仍宽 640px。
若希望视频始终与容器等宽，可改用 width: 100%; height: auto;。此时容器宽 800px，视频也会放大到 800px。