:first-letter 伪对象
<style type="text/css">
p:first-letter{color:red;}
</style>
<p>abcdefg</p>
字母 a 变成红色。
:first-line 伪对象
<style type="text/css">
p:first-line{color:red;}
p{width:50px;}
</style>
<p>ITPOWITPOWITPOWITPOWITPOWITPOW</p>
第一行为红色。
:before、:after 伪对象
<style type="text/css">
p{font-weight:bold;}
p:before{color:red;content:"前";}
p:after{color:red;content:"后";}
</style>
<p>1</p>
可以发现,在 1 前面插入了红色的“前”字,在 1 后面插入了红色的“后”字,都是粗体的。IE 6 不支持。