來看看這個問題「子元素為什麼設定margin-top會影響父元素的margin-top。
再給父元素設定寬高，子元素設定寬高。
然後又設定子元素的margin-top為20px。
效果如下
查了下，簡單來說是因為父元素沒有設定padding或者border時，第乙個子元素會和父元素的margin-top重疊（w3c就這麼規定滴，不用疑問為什麼會這麼做）。
解決方法就是
父元素設定padding
或者父元素設定border
或者父元素設定overflow
解決了^_^之前沒遇到是因為這幾個屬性太常見了，設定的比較頻繁...所以之前沒遇到。
子元素的margin top會影響父元素
恢復內容開始 在css2.1盒模型中 in this specification,the expression collapsing margins means that adjoining margins no non empty content,padding or border areas o...
子元素應該margin top影響父元素的解決辦法
在子元素設定margin top，有時會帶著父元素一起移動。原因 outer div margin 0 auto inner div margin top 10px 根據css2.1盒模型規範，兩層div結構，outer div屬性為 margin 0 auto 本該緊貼外框頂部的，如果沒有inne...
子元素的margin top與父元素合併的問題
問題集 整理自網路 貌似這個 collapsing margins 的問題由來已久啊！一般解釋是 2個或以上盒模型之間 關係可以是相鄰或巢狀 相鄰的margin屬性 這之間不能有非空內容 padding區域 border邊框或使用清除分離方法 結合表示為乙個單獨的margin。w3school是這麼...