margin和padding的值是百分比的时候是怎么计算的?

百分比取值的计算

对元素的margin和padding设置百分比的时候,他的百分比是相对于父元素的宽度width计算的,margin上下左右都是如此。
如果没有为元素声明width的时候,此时元素的宽度取决于父元素的width,这样可以得到流式布局,元素的外边距会扩大和缩小来适应父元素的大小。
为什么都是相对于宽度而不是高度:
CSS权威指南中的解释:
我们认为,正常流中的大多数元素都会足够高以包含其后代元素(包括外边距),如果一个元素的上下外边距时父元素的height的百分数,就可能导致一个无限循环,父元素的height会增加,以适应后代元素上下外边距的增加,而相应的,上下外边距因为父元素height的增加也会增加,如此循环。

猜你喜欢

转载自www.cnblogs.com/my466879168/p/13173264.html
今日推荐