优艾设计网

没明白盒子的height随width的变化这段css是怎样实现的??

优艾设计网 https://www.uibq.com 2023-04-19 14:19 出处:网络 作者:PS自学
刚看到这段css代码,实现了一个1:1长宽比例并且随网页变化的盒子,没有明白它设置height的原理是什么? .item { width: 20优艾设计网_Photoshop问答%; background-color: red; } .item:before { content: \'; display:

刚看到这段css代码,实现了一个1:1长宽比例并且随网页变化的盒子,没有明白它设置height的原理是什么?

.item {

width: 20优艾设计网_Photoshop问答%; background-color: red;

}

.item:before {

content: '; display: block; padding-top: 100%;

}


如果哲学有声音 2022-07-16 08:1优艾设计网_设计百科4

padding-top: percent 是根据包含块宽度的比例来计算的


0

精彩评论

暂无评论...
验证码 换一张
取 消