用:after清除浮动

之前清除浮动的时候习惯加一个空白的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;的作用是允许浏览器渲染它，但是不显示出来，这样才能实现清除浮动。

这样就不用再添加一个标签来清除浮动啦。