css中伪元素及伪类::after和::before清除浮动或float

css或html经常需要清除浮动div可以使用

<div style="clear:both"></div>

但还有另一种办法使用元素的:before或:after来清除爱去

注意：content，clear，display三者缺一不可。

双冒号和单冒号效果相同。

伪类:
a:link {color: #FF0000} /* 未访问的链接 /
a:visited {color: #00FF00} / 已访问的链接 /
a:hover {color: #FF00FF} / 鼠标移动到链接上 /
a:active {color: #0000FF} / 选定的链接 */

伪元素（如果想兼容旧浏览器用单冒号:）:
::after
::before

某个div子元素设置浮动,让父div任然有高度的方法，子元素浮动父元素高度自适应。

1.在该div下面加上伪类：

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

2.清除子元素所有浮动，将其均设置为display:inline-block。

3.在子元素中再添加一个空元素，设置其样式为clear:both。