Question

您好，我想问一下html5视频尺寸自适应问题

.vid-wrapper{
width:100%; 这个宽度是100%，是div的宽度是100%吗？那不会浏览器窗口全都占上吗？
position:relative;
padding-bottom:56.25%; 为什么要用padding-bottom来维持16:9？
height: 0; 为什么height的值是0？
}
.vid-wrapper video{
position: absolute;
top:0;
left: 0;
width: 100%;
height: 100%

您回答的我有些疑惑，希望大神可以讲清楚一些

Answer 1

padding-bottom:56.25%; 为什么要用padding-bottom来维持16:9？
这个通俗点说 就是现在 宽度是1， 结果需要得到9/16，求高度 ===》》 结果就是0.5625，
而且视频要求自适应，height设置百分比是相当于父容器来说的，而padding是自身的 所以要设置padding而不是height