之前清除浮动的时候习惯加一个空白的div.clear,这样做的话就会多出一个div,感觉怪怪哒,今天看到了一个用:after清除浮动的方法。举个栗子,在一个div.wrapper里面有三个div,这三个div都有float:left;想要清除浮动的话,按我之前的做法是在.wrapper里面的第三个div后面加上一个div.clear,给它一个clear:both;,而我今天了解到的这种清除浮动的方法是这样的
.wrapper:after{ content:''; visibility:hidden; display:block; width:0; height:0; clear:both; }
visibility:hidden;的作用是允许浏览器渲染它,但是不显示出来,这样才能实现清除浮动。
这样就不用再添加一个标签来清除浮动啦。