:before和:after伪元素在CSS中可以被用来添加元素、加小标、清浮动等。
基本用法:
p::before {}
p::after {}
1、string
<style type="text/css"> p::before{ content: "《"; color: blue;
} p::after{ content: "》"; color: blue;
}
</style>
<p>::before和::after伪元素的使用</p>
结果为:《::before和::after伪元素的使用》
2.attr()
调用当前元素的属性,可以方便的比如将图片的 Alt 提示文字或者链接的 href 地址显示出来。示例:
<style type="text/css"> a::after { content: "("attr(href) ")";
}
</style>
<a href="www.baidu.com">百度</a>
结果为:
3.清除浮动
.clearfix:after { clear: both; display: block; content: ""; visibility: hidden;
}