以下兩種情況會出現外邊距合併:
1.垂直相鄰的兩個盒子，當他們的垂直外邊距相遇時,會合併為乙個外邊距。也叫外邊距重疊。
1.1當外邊距的數值都為正數時，取數值較大的。
1.2當外邊距的數值都是負數時，取絕對值較大的。
1.3當外邊距的數值一正一負時，取他們的和。
解決方法:
1. 只設定乙個外邊距
2.父子巢狀的盒子，子盒子設定的margin-top,會產生在父盒子身上.
2.1解決方案:
給父級新增乙個 overflow:hidden;
3.外邊距不重疊的情況.
2.1水平外邊距永不重疊.
2.2設定了overflow(visible)的元素和它的子元素之間的margin不會重疊.
2.3設定了絕對定位的盒模型（因為脫離文件流?)，垂直以及和子元素之間的margin不會重疊.
2.4設定了display:inline-block的盒子，垂直以及和子元素之間的margin不會重疊.
學習這個知識點的作用:了解盒子模型外邊距的一些規則。
外邊距合併（外邊距塌陷）
使用margin定義塊元素的垂直外邊距時，可能會出現外邊距的合併。當上下相鄰的兩個塊元素相遇時，如果上面的元素有下外邊距margin bottom，下面的元素有上外邊距margin top，則他們之間的垂直間距不是margin bottom與margin top之和，而是兩者中的較大者。這種現象被稱...
外邊距塌陷 外邊距合併
1.父子塊級 元素外邊距塌陷 子元素加margin top,父元素也加margin top,如果父元素沒有設定margin top,那預設0,取的是其中最大 的值,這個效果作用父元素身上啦 原因 他倆共用乙個外邊距 解決 方法一 給父元素加 border padding 方法二 給父元素加overf...
外邊距合併
從3個簡單的小例子來看外邊距合併 給h1加50px的margin，但實際上h1和div的margin合併在一起了 detail設定margin為30px,header設定margin為30px，結果兩個相鄰元素之間的間距發生了合併 而且合併寬度是margin數值大的為準。如下圖detail和head...