1 写法p:before{} 在每个<p>元素之前插入内容.如下图

屏幕快照 2016-04-05 下午10.31.10.png

结果如右边所示

2 写法p:after{} 在每个<p>元素之后插入内容.如下图

屏幕快照 2016-04-05 下午10.35.05.png

结果如右边所示

3 写法p:nth-child(2){} 选择属于其父级的第二个元素.如下图

屏幕快照 2016-04-05 下午10.49.17.png

结果如右边所示

4 写法p:nth-last-child(2){}选择属于其父级的倒数第二个元素.如下图

屏幕快照 2016-04-05 下午10.52.53.png

结果如右边所示

5 写法p:nth-of-type(2){} 选择属于其父级的第二个p元素.如下图

屏幕快照 2016-04-05 下午10.55.20.png

结果如右边所示

6 写法p:nth-of-last-type(2){} 选择属于其父级的倒数第二个p元素.如下图

屏幕快照 2016-04-05 下午11.10.22.png

结果如右边所示

7 写法p:last-child{} 选择倒数第一个元素,是p元素就改变,不是就不变.如下图

屏幕快照 2016-04-05 下午11.14.02.png 屏幕快照 2016-04-05 下午11.15.34.png

结果如右边所示

今天就先到这里了.明天继续.