码迷,mamicode.com
首页 > 其他好文 > 详细

当margin和padding的值是百分比时,如何计算

时间:2019-10-31 18:24:28      阅读:123      评论:0      收藏:0      [点我收藏+]

标签:target   缩小   无限循环   大小   解释   get   页面   扩大   http   

对元素的margin设置百分数时,百分数是相对于父元素的width计算,不管是margin-top/margin-bottom还是margin-left/margin-right。当然,padding的原理也是一样的。

如果没有为元素声明width,此时元素框的总宽度包括外边距取决于父元素的width,这样可能得到“流式”页面,即元素的外边距会扩大或缩小以适应父元素的实际大小。

为什么margin-top/margin-bottom的百分数是相对于width而不是height呢?

CSS权威指南中的解释:

我们认为,正常流中的大多数元素都会足够高以包含其后代元素(包括外边距),如果一个元素的上下外边距时父元素的height的百分数,就可能导致一个无限循环,父元素的height会增加,以适应后代元素上下外边距的增加,而相应的,上下外边距因为父元素height的增加也会增加,如此循环。

原文链接:https://blog.csdn.net/i_will_be/article/details/77404722

当margin和padding的值是百分比时,如何计算

标签:target   缩小   无限循环   大小   解释   get   页面   扩大   http   

原文地址:https://www.cnblogs.com/momo798/p/11772683.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!