外邊距摺疊：相鄰的兩個或多個外邊距 (margin) 在垂直方向會合併成乙個外邊距（margin）
相鄰：沒有被非空內容、padding、border 或 clear 分隔開的margin特性. 非空內容就是說這元素之間要麼是兄弟關係或者父子關係
charset="utf-8">
title>
type="text/css">
* #div1
#div2
#div3
style>
head>
id="div1">
id="div2">
id="div3">
div>
div>
div>
body>
html>
因為div2與div3的外邊距是相鄰的（是父子關係的相鄰），當div2 margin-top為20,div3的margin-top也為50,此時div2與div3的外邊距會合併，就是摺疊。
而div1與div2的外邊距不是相鄰的（div1有border），它們便不會摺疊。
參加摺疊的margin都是正值：取其中 margin 較大的值為最終 margin 值。
charset="utf-8">
邊距摺疊title>
head>
style="height:90px; margin-bottom:99px; width:90px; background-color: red;">xdiv>
style="height:90px; margin-top:100px; width:90px; background-color: blue;">ydiv>
body>
html>
charset="utf-8">
邊距摺疊title>
head>
style="height:90px; margin-bottom:-10px; width:90px; background-color: red;">xdiv>
style="height:90px; margin-top:-30px;width:70px; background-color: blue;">ydiv>
body>
html>
裝載自
css3與頁面布局學習總結（二）——box model、邊距摺疊、內聯與塊標籤、cssreset
CSS外邊距摺疊問題
毗鄰的兩個或多個margin會合併成乙個margin，叫做外邊距摺疊，也叫外邊距合併。如果你還是不懂請參照 css 外邊距合併 兩點 1 摺疊只會發生在垂直方向 2 合併後的外邊距的高度等於兩個發生合併的外邊距的高度中的較大者。摺疊規則 避免外邊距摺疊 type text css body div1...
CSS之外邊距摺疊
collapsing margins，即外邊距摺疊，指的是毗鄰的兩個或多個外邊距 margin 會合併成乙個外邊距。其中所說的 margin 毗鄰，可以歸結為以下兩點 兩個或多個 說明其數量必須是大於乙個，又說明，摺疊是元素與元素間相互的行為，不存在 a 和 b 摺疊，b 沒有和 a 摺疊的現象。毗...
CSS3高階技術
多重陰影，用逗號隔開 內陰影在前面新增inset關鍵字 box shadow inset 10px 10px 5px 888888 多重陰影和text shadow類似 一 線性漸變 如果想要改變漸變方向，可以自定義乙個角度 二 徑向漸變 語法 漸變形狀有兩種 圓 circle 和橢圓 ellips...