塊級(jí)元素的上下邊距和左右邊距有時(shí)會(huì)合并(或折疊)為一個(gè)外邊距酵紫,其大小取其中的最大者,這種行為稱為外邊距折疊(margin collapsing),有時(shí)也翻譯為外邊距合并须肆。注意浮動(dòng)元素和絕對(duì)定位的元素的外邊距不會(huì)折疊内舟。
下面列出了會(huì)發(fā)生外邊距折疊的三種基本情況:
相鄰元素之間
毗鄰的兩個(gè)元素之間的外邊距會(huì)折疊(除非后一個(gè)元素需要清除之前元素的浮動(dòng))合敦。
父元素與其第一個(gè)或最后一個(gè)子元素之間
如果在父元素與其第一個(gè)子元素之間不存在邊框、內(nèi)邊距验游、行內(nèi)內(nèi)容充岛,也沒有創(chuàng)建塊格式化上下文、或者清除浮動(dòng)將兩者的margin-top分開耕蝉;或者在父元素與其最后一個(gè)子元素之間不存在邊框崔梗、內(nèi)邊距、行內(nèi)內(nèi)容垒在、height蒜魄、min-height、max-height將兩者的margin-bottom分開场躯,那么這兩對(duì)外邊距之間會(huì)產(chǎn)生折疊谈为。此時(shí)子元素的外邊距會(huì)“溢出”到父元素的外面。
空的塊級(jí)元素
如果一個(gè)塊級(jí)元素中不包含任何內(nèi)容踢关,并且在其margin-top與margin-bottom之間沒有邊框伞鲫、內(nèi)邊距、行內(nèi)內(nèi)容耘成、height榔昔、min-height將兩者分開,則該元素的上下外邊距會(huì)折疊瘪菌。
一些需要注意的地方:
上述情況的組合會(huì)產(chǎn)生更復(fù)雜的外邊距折疊撒会。
即使某一外邊距為0,這些規(guī)則仍然適用师妙。因此就算父元素的外邊距是0诵肛,第一個(gè)或最后一個(gè)子元素的外邊距仍然會(huì)“溢出”到父元素的外面。
如果參與折疊的外邊距中包含負(fù)值默穴,折疊后的外邊距的值為最大的正邊距與最小的負(fù)邊距(即絕對(duì)值最大的負(fù)邊距)的和怔檩。
如果所有參與折疊的外邊距都為負(fù),折疊后的外邊距的值為最小的負(fù)邊距的值蓄诽。這一規(guī)則適用于相鄰元素和嵌套元素薛训。