所有主流浏览器都支持 :after 选择器。:after 选择器在被选元素的内容后面插入内容。请使用 content 属性来指定要插入的内容。
在每个 <p> 元素后面插入内容,并设置所插入内容的样式:
p:after
{
content:"台词:-";
background-color:yellow;
color:red;
font-weight:bold;
}
:before 和 :after选择器太灵活了,貌似人们每天都能找到或者发明一些新办法来有效地使用它们。它们很容易控制选择器周围的内容。
很多第一次使用是因为他们需要对clear-fix进行改进。
.clearfix:after {
content: "";
display: block;
clear: both;
visibility: hidden;
font-size: 0;
height: 0;
}
.clearfix {
*display: inline-block;
_height: 1%;
}
这个改进使用了:after伪类元素来在元素后增加一个空间,然后清除它。这个牛X的技巧你应该收藏到工具包里,特别是当overflow:hidden方法无能为力的时候。