纯 css 实现保持 div 宽高比

Last Updated: February 28, 2020 · 1 min read

保持 div 宽高比这个需求其实完全可以使用 css 完成,以 16:9 为例

html
css

其中 padding-bottom: 56.25%; 是关键点,因为 css 中 padding 为百分比时是计算父元素宽度,所以 9 / 16 * 100 = 56.25

在线预览


©2022xiaojun1994
 0   0