（一）:root选择器

:root选择器用于匹配文档根元素，在HTML中，根元素始终是html标签。也就是说使用该选择器定义的样式，对页面所有的元素都生效。对于不需要该样式的元素，可以单独设置样式进行覆盖。

（二）:not选择器

如果对于结构元素使用样式，但是想排除这个元素下面的子结构元素，让他不使用这个样式，可以使用:not选择器。

  1. body *:not(h3){
  2.     color:red;
  3. }
  4. <h3>1</h3>        //不变颜色
  5. <p>2</p>            //变颜色
  6. <p>3</p>            //变颜色
  7. <p>4</p>            //变颜色
  8. <p>5</p>            //变颜色

（三）:only-child选择器

:only-child选择器用于匹配属于某父元素的唯一子元素的元素，也就是说，如某个父元素仅有一个子元素，则使用该选择器可以去选择这个子元素

li:only-child{
    color:red;
}
<div>
  <ul>
    <li>1</li>
    <li>2</li>
    <li>3</li>
  </ul>
  <ul>
    <li>4</li>        //变颜色
  </ul>
  <ul>
    <li>5</li>
    <li>6</li>
    <li>7</li>
  </ul>
</div>

（四）:first-child和:last-child选择器

:first-child和:last-child选择器分别用于父元素中的第一个或者最后一下子元素设置样式。

p:first-child{
    color:red;
}
p:last-child{
    font-size:100px;
}

<body>
  <p>1</p>        //改变颜色
  <p>2</p>
  <p>3</p>
  <p>4</p>        //改变字体大小
</body>

（五）:nth-child(n)和:nth-last-child(n)选择器

上一个选择器的扩展， 分别为属于其父元素的第n个子元素和倒数第n个子元素

单双数：

odd 和 even 是可用于匹配下标是奇数或偶数的子元素的关键词（第一个子元素的下标是 1）。
可以用这两个写在括号里从而控制单双数的样式

（六）:nth-of-type(n)和:nth-last-of-type(n)选择器

nth-child 是查找一堆兄弟元素里的第n个元素，不管那元素是什么，只要它排行第n就行。
nth-of-type 是在一堆兄弟元素里找到相同HTML标记类型元素中排行第n的元素。

（七）:empty选择器

用来选择没有子元素或文本内容为空得所有元素

（八）:target选择器

用于为页面中的某个target元素（该元素的id被当作页面中的超链接来使用）指定样式。只有用户单击了页面中的超链接，并且跳转target元素后，:targer选择器所设置的样式才会起作用

:target{backgroud-color:red}
<body>
  <h1>这是标题</h1>
  <p><a href="#news1">跳转至内容1</a></p>
    <p><a href="#news2">跳转至内容2</a></p>
  <p>请单击上面的链接，:target选择器会突然显示当前活动的HTML锚</p>
  <p id="news1"><b>内容1....</b></p>
  <p id="news2"><b>内容2....</b></p>
</body>

单击链接时，所链接到的内容将会被添加上背景颜色效果