zxdfe / FE-Interview

Every step counts
34 stars 1 forks source link

第74题:什么是外边距重叠(collapsing margins)/ margin坍塌? #75

Open zxdfe opened 2 years ago

zxdfe commented 2 years ago
Lsunlight commented 1 year ago

外边距重叠指的是,当两个垂直外边距相遇时,它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的外边距的高度中的高度如果都是正边界,边界宽度是相邻边界宽度中最大的值。如果出现负边界,则在最大的正边界中减去绝对值最大的负边界。如果没有正边界,则从零中减去绝对值最大的负边界。 外边距重叠的好处:当我们上下排列一系列规则的块级元素时,那么块元素之间因为外边距重叠的存在,段落之间就不会产生双倍的距离,这样各处距离就一致了。就像p段落中,如果p段落中有多行,那么外边距重叠就能避免产生双倍行距。 如何清除外边距重叠:给一个元素设置display: inline-block就可以,

2734209032 commented 1 year ago

外边距重叠只在上下边距存在,左右不存在,两个在正常流中相邻(兄弟或父子关系)的块级元素的外边距会组合在一起成单边距,如果2个边距都是正数,取最大的那个,2个都是负数,取绝对值大的那个,一正一负取2个的和