會導致外邊距塌陷的兩種情況
情況一：兩個兄弟盒子，上面的盒子設置了margin-bottom,下面的盒子設置了margin-top,實際中會取值較大的那個屬性值顯示在網頁中。這種情況一般較為少見。這兩個屬性只設置一個即可解決。
情況二：嵌套盒子（父元素與子元素）間的外邊距塌陷（發生在垂直方向上的外邊距合並，注意是垂直方向）
解決情況二的外邊距塌陷一共有三種方法
方法一：給父元素加邊框border
方法二：給父元素加內邊距padding以達到類似效果
方法三：給父元素設置overflow:hidden;