css3的伪类
2016-04-05 本文已影响31人
你的言语我爱听却不懂
1 写法p:before{} 在每个<p>元素之前插入内容.如下图
![](https://img.haomeiwen.com/i1850389/f63d8656094c1c00.png)
结果如右边所示
2 写法p:after{} 在每个<p>元素之后插入内容.如下图
![](https://img.haomeiwen.com/i1850389/d3310426fc173775.png)
结果如右边所示
3 写法p:nth-child(2){} 选择属于其父级的第二个元素.如下图
![](https://img.haomeiwen.com/i1850389/3ed38d4b3fcf1b74.png)
结果如右边所示
4 写法p:nth-last-child(2){}选择属于其父级的倒数第二个元素.如下图
![](https://img.haomeiwen.com/i1850389/8d4fa35c66636ff7.png)
结果如右边所示
5 写法p:nth-of-type(2){} 选择属于其父级的第二个p元素.如下图
![](https://img.haomeiwen.com/i1850389/b775d102f23d1049.png)
结果如右边所示
6 写法p:nth-of-last-type(2){} 选择属于其父级的倒数第二个p元素.如下图
![](https://img.haomeiwen.com/i1850389/99d5a6d8498a727a.png)
结果如右边所示
7 写法p:last-child{} 选择倒数第一个元素,是p元素就改变,不是就不变.如下图
![](https://img.haomeiwen.com/i1850389/c33ec5383983cd41.png)
![](https://img.haomeiwen.com/i1850389/cf8d4128e75faa07.png)