在日常****現的乙個問題現象：
明明為子div中設定了margin-top的屬性，但是並沒有效果，反而，當子div的margin-top屬性的值大於父div的margin-top的值的時候，整個結構往下移動，而不是子div與父div的頂端有margin距離。
此時，為父div設定屬性border-top之後，子div成功地與父div有了margin距離，
但是，這樣地實現方法顯然是不符合編碼方式的。
於是，有以下方法可以來解決這個現象。改變盒子的語法規則。
為父div新增一下其中乙個屬性
overflow:hidden;
display:inline-block;
float: left;
position: absolute;
都能觸發bfc，實現效果（下面是overflow的舉例）
但是這些方法中沒有所謂最優的方法，應該根據具體的需求去選擇合適的方法來解決margin塌陷的bug
margin-left: 100px;
margin-top: 100px;
width: 100px;
height: 100px;
background-color: black;
overflow: hidden;
}.content
margin塌陷 margin合併的解決
父子巢狀元素垂直方向的 margin，父子元素是結合在一起的，他們兩個會取其中最大的值 正常情況應該是父級相對於瀏覽器進行定位，子級應該相對於父級定位的 但是 margin 塌陷是在父級相對於瀏覽器進行定位時，子級沒有相對於父級定位，就像父級的棚子沒有了一樣子級相對於父級，就像塌陷了一樣 a.給父元...
css學習筆記 解決margin塌陷問題
content 此時margin top 50px並沒有達到想要的效果，實際效果確實他會帶著他的父級元素一起向下50畫素，該現象就是margin塌陷引起的 解決辦法 1 給父元素設定border top會解決此問題 不建議使用，設定border會影響父元素的高度 2 通過bfc block form...
關於margin的塌陷問題
1 兄弟關係的外間距塌陷 元素並列，垂直方向相鄰的margin相遇會出現疊加 兩值不同時取較大的值 原因 上下兩兄弟關係的盒子共用乙個外間距 解決 1 為兩盒子分別套乙個父級盒子，並在父級盒子新增overflow hidden 2 將兩兄弟分別觸發bfc 2 並列關係的外間距塌陷 元素巢狀 子元素的...