通常一些轮播，或者一些顶部的封面图都需要根据设备宽度来调整图片显示的大小，而不是写死容器高度。如下图
image.png
image.png
所以可以通过如下方式实现，
position: relative;
width: 100%;
height: 0;
padding-top: 40%;
然后子元素
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
其中padding-top中的百分比是按照父元素的宽度的百分比计算的，比如父元素width为375px，则padding-top: 150px
关于css样式的百分比都相对于谁，可以看看知乎上面的讨论https://www.zhihu.com/question/36079531
