                        课程
                    
                        /前端开发
                        
                            /HTML/CSS
                        
                        /从 psd 到 html

为什么清除浮动是以下这么写的呢？请帮忙分析以下代码~

.clearfloat{
	zoom: 1;
}
.clearfloat:after{
	display: block;
	clear: both;
	content: "";
	visibility: hidden;
	height: 0;
}

补充：平时只用clear:both和其它几种网上看来的小方法清除浮动，上面这个清除浮动的内容比较多，还用到了伪类，想知道具体是什么原理，这种写法和其它写法的不同。

小佳佳QAQ

2016-12-13

源自：从 psd 到 html 2-1

关注问题我要回答

1862

操作

收起

4 回答

小白小白小白啦回答被采纳 +3 积分
2016-12-17

这个和用clear:both原理一样，只是如果你用clear:both的话，要在每个需要清除浮动的下面都写一个div，然后给这个div设置clear:both，是不是很麻烦？after的作用是在元素的最后面添加一个元素，你可以设置这个元素的css样式，里面的height，visibility，display只是为了让这个添加的元素不可见，真正起作用得还是clear:both，content是设置after的内容，为空就是为了不显示任何东西。。。如果你想搞清楚得话可以百度after就知道了。