# 清除浮動方法二： clear屬性 ## CSS有個clear屬性，專門清除浮動元素帶來的影響。 屬性值： left:清除前面左浮動的影響 right:清除前面右浮動的影響 both:清除前面所有浮動的影響 # 清除浮動方法三：隔墻法 ``` .div{ clear:both; heigtht：20px; } ``` ### 利用clear屬性和height屬性，制作一堵墻，將兩個有浮動的元素父親隔離起來。 隔墻法代碼： ``` *{ margin:?0; padding:?0; ????} .box{ width:800px; border:?5pxsolidred; ????} .box1{ width:800px; border:?5pxsolidrgb(16,?95,?243); clear:both; ????} .cl{ clear:both; height:20px; } .boxp{ width:?80px; height:80px; background-color:cyan; float:left; margin:05px; } .box1p{ width:?80px; height:80px; background-color:rgb(231,?247,?8); float:left; margin:05px; } ``` 隔離法如圖：  隔墻法缺點： 缺點：子盒子還是不能撐高父盒子的高度。 # 清除浮動方法三：內墻法 ### 通過隔墻法演變而來，將墻放在兩個受影響父元素內部，所有的子元素最后，設置一堵內墻法，設置clear屬性。 代碼如下： ``` \*{ margin:?0; padding:?0; ????} .box{ width:800px; border:?5pxsolidred; ????} .box1{ width:800px; border:?5pxsolidrgb(16,?95,?243); clear:both; ????} .cl{ clear:both; } .boxp{ width:?80px; height:80px; background-color:cyan; float:left; margin:05px; } .box1p{ width:?80px; height:80px; background-color:rgb(231,?247,?8); float:left; margin:05px; } ```