p::before {} p::after {}
<style type="text/css">
p::before{
content: "《";
color: blue;
}
p::after{
content: "》";
color: blue;
}
</style>
<p>::before和::after伪元素的使用</p>
结果为：《::before和::after伪元素的使用》
调用当前元素的属性，可以方便的比如将图片的 Alt 提示文字或者链接的 href 地址显示出来。示例：
<style type="text/css">
a::after {
content: "("attr(href) ")";
}
</style>
<a href="www.baidu.com">百度</a>
结果为：
.clearfix:after {
clear: both;
display: block;
content: "";
visibility: hidden;
}
原文：https://www.cnblogs.com/lwming/p/10928367.html