清除浮动的方法
父子级清除浮动:
1.在子级元素后添加一个空元素,为其添加clear:both 弊端:增加了无意义的元素结构
2.给父级元素设置一个overflow:hidden 解决了第一种方法的弊端 【最推荐使用第二种】
3.使用伪元素::after清除 为需要清除浮动元素的伪对象中设置height:0,
#layout:after{
clear:both;
content:”";
visibility:hidden;
height:0;}
(用伪类清除浮动时用after,并且加上content:""可以加内容也可以不加,但是一定要加上display: block;同时还要写clear:both;)
兄弟级清除浮动:
给当前元素(被浮动影响的元素)设置css属性clear,值可为left、right,both。作用分别为清除左浮动元素带来的影响,清除右浮动元素带来的影响,清除左右两侧浮动元素带来的影响。