17。CSS伪类

　　举一个简单的例子来说明什么是伪类？
　　从之前的代码中，如下图，我们像给这两个列表中的某一列单独设置样式，我们该如何做呢？
　　我们肯定会选择在li标签上添加class去实现，如下
         
开始标记
         
结束标记
         
实际元素
       
      
         
能够使用基本的 Web 开发语言
         
手工制作漂亮的网站，而不是依赖像 Wordpress 或 Wix 这样的工具
         
构建 Web 应用程序
         
给朋友留下深刻印象
         
玩得开心
       
　　之后添加CSS代码即可
　　.first-li {   font-weight: bold; }
　　但是我们有更好的方法去实现此类目的，使用伪元素#CSS中添加：  li:first-child { font-weight: bold; }
　　这样仍然可以实现！
　　我们可以看作是我们的父类，而是孩子child，第一个孩子就是first-child
　　举一反三，现在如果像让最后一个元素是斜体，我们可以这样去写。li:last-child {   font-style: italic; }
　　当然，我们也可以随意指定一个li元素，给与附加单独样式，例如我想要第二个li元素li:nth-child(2) {   color: red; }
　　除了上述，还有其他用法：将奇数的li元素设置为红色li:nth-child(odd) {   color: red; }将偶数的li元素设置为红色li:nth-child(even) {   color: red; }
　　按照以上方式设置段落例如我们想给文章的第一个P标签给予红色样式
　　我们会这样写。article p:first-child {   color: red; }
　　但是这样并不会奏效！！！
　　看下尾部，写上就会奏效
　　article p:last-child {   color: red; }
　　这是为什么呢？
　　注意：article p:first-child我们并不能理解为是aritcle的第一个P标签的＂孩子＂，而是aritcle的第一个＂孩子＂，由于article的第一个孩子不是p标签，故而没有生效。而最后一个标签是p标签，故而last-child可以生效。所以，当父元素中又很多不同的子元素，伪类就不能很好的工作。