一、什麼是高度塌陷
在文件流中，當父元素沒有設定高度的時候，父元素的高度就取決於子元素的高度，也就是常常說的「由子元素撐開」。當子元素設定為浮動，脫離了文件流，這時候就會造成父元素的高度塌陷，因為沒有子元素「撐著它的高度」。這樣會導致父元素後面的元素往上移，造成布局混亂。
二、解決此問題的方法
1.在後面增加空的子元素，設定clear:both；
2.給父元素設定height；
3.給父元素建立bfc，這樣它就可以包含浮動元素；
1）overflow:hidden，可能會導致內容截胡或者出現滾動條
2）display:inline-block，父元素寬度會丟失
4.設定萬能清除法（推薦使用）
.clear：:after
高度塌陷解決方法
如果父元素只包含浮動元素，且父元素未設定高度和寬度，那麼它的高度就會塌縮為零，也就是所謂的 高度塌陷 如果父級元素包含背景或者邊框，那麼溢位的元素就不像父級元素的一部分了。解決 高度塌陷 問題的方法 1.浮動父級元素，父級元素的高度就會擴大，直到完全包含它裡面的浮動元素。如果使用這種方法，一定要在該...
高度塌陷的原因及解決方法
子元素可以撐開父元素的高度，但是子元素如果有浮動就不能撐不開父元素的高度 高度塌陷了 什麼情況下會出現高度塌陷，子元素浮動，而父元素沒有高度會出現高度塌陷。解決高度塌陷的方法 方法1 給父元素加overflow hidden 觸發了bfc 缺點 超出的元素會被隱藏。方法2 給需要清浮動的地方加乙個空...
高度塌陷的產生原因及解決方法
當父元素未設定高度 時，所有子元素浮動後，造成 子元素脫離文件流進而無法把父元素撐開，父元素高度為0 產生高度塌陷 稱為高度塌陷問題。父元素高度塌陷後，父元素以下的元素都會向上移動，導致布局混亂，所以我們要解決高度塌陷的問題。如下 當我們讓div1和div浮動之後 我們可以發現，當子元素全都浮動後，...