給父級元素新增高度
優點：解決簡單
缺點：就不能做到寬高自適應了
在出現高度塌陷的父級元素設定overflow:hidden
優點：可以解決高度塌陷並且能做到自適應，好理解
缺點：超出當前父級元素的盒子都會被隱藏掉
在最後乙個盒子新增標籤div，設定解決高度塌陷的樣式
預設樣式：clear：both 清除both 所以 left/right
清除浮動的原理：清除浮動元素預留下來的空間，為了放心乙個浮動元素，清除了上方預留空間，所以可以解決高度塌陷
優點：出現高度塌陷的地方加乙個標籤即可
缺點：新增盒子，出現一些不必要的布局結構，**冗餘
萬能清楚法 – 不好理解,會用就行
在當前出現高度塌陷的元素上新增類名 clear-fix
clear-fix::after
優點：清除方便
缺點：**多，難理解
高度塌陷解決方法
如果父元素只包含浮動元素，且父元素未設定高度和寬度，那麼它的高度就會塌縮為零，也就是所謂的 高度塌陷 如果父級元素包含背景或者邊框，那麼溢位的元素就不像父級元素的一部分了。解決 高度塌陷 問題的方法 1.浮動父級元素，父級元素的高度就會擴大，直到完全包含它裡面的浮動元素。如果使用這種方法，一定要在該...
高度塌陷的產生原因及解決方法
當父元素未設定高度 時，所有子元素浮動後，造成 子元素脫離文件流進而無法把父元素撐開，父元素高度為0 產生高度塌陷 稱為高度塌陷問題。父元素高度塌陷後，父元素以下的元素都會向上移動，導致布局混亂，所以我們要解決高度塌陷的問題。如下 當我們讓div1和div浮動之後 我們可以發現，當子元素全都浮動後，...
高度塌陷的產生條件和解決方法
高度塌陷一般由浮動或者絕對或固定定位引起，定位引起的高度塌陷可以更換定位，這裡就不再累述了，這裡介紹下浮動引起的高度塌陷及解決辦法。浮動除了會讓元素水平排列外，還會讓元素脫離文件，讓下面的元素頂上去，文字會環繞顯示，這就是高度塌陷。box box1,box2,box3 在這裡插入描述 可以看到，如果...