元素。
2元素的每个
元素。
3:last-of-typep:last-of-type选择属于其父元素的最后元素的每个
元素。
3:only-of-typep:only-of-type选择属于其父元素唯一的元素的每个
元素。
3:only-childp:only-child选择属于其父元素的唯一子元素的每个元素。
3:nth-child(n)p:nth-child(2)选择属于其父元素的第二个子元素的每个元素。
3:nth-last-child(n)p:nth-last-child(2)同上，从最后一个子元素开始计数。3:nth-of-type(n)p:nth-of-type(2)选择属于其父元素第二个元素的每个
元素。
3:nth-last-of-type(n)p:nth-last-of-type(2)同上，但是从最后一个子元素开始计数。3:last-childp:last-child选择属于其父元素最后一个子元素每个元素。
3选择属于其父元素的首个子元素的每个 < p> 元素(也可以理解为选中同级别的第一个标签看他是不是p标签，比如爷爷辈的老大并且是p标签，父亲辈的老大并且是p标签，儿子辈的老大并且是p标签。。。等，如果是那就改变其样式，只能是老大，老二是P标签就不改变样式)
<!DOCTYPE html> <html> <head> <style> p:first-child { background-color:yellow; } </style> </head> <body> <a href = "#">我是第一个子元素，但我不是段落</a> <p>这个段落是其父元素（body）的首个子元素。</p> <h1>欢迎访问我的主页</h1> <p>这个段落不是其父元素的首个子元素。</p> <div> <p>这个段落是其父元素（div）的首个子元素。</p> <p>这个段落不是其父元素的首个子元素。</p> </div> <p><b>注释：</b>对于 IE8 及更早版本的浏览器中的 :first-child，必须声明 <!DOCTYPE>。</p> </body> </html>效果如下:
注意：body也是一个父标签。
指定父元素的首个 p 元素的背景色：(注意这个选择器和上边区别，那个相当只寻找每个辈分中长子中的p标签，是就要不是就去下一辈找。这个选择器比较有耐心，这一辈中一直往下找，直到找到第一个p标签，如果找不到就去下一辈。同级别的同类型的第一个)
<!DOCTYPE html> <html> <head> <style> p:first-of-type { background:#ff0000; } </style> </head> <body> <h1>这是标题</h1> <a href = "#">我是第一个子元素，但我不是段落</a> <p>这是第一个段落。</p> <p>这是第二个段落。</p> <div> <h1>这个段落是其父元素（div）的首个子元素。</h1> <p>这个段落不是其父元素的首个子元素。</p> </div> <p>这是第三个段落。</p> <p>这是第四个段落。</p> </body> </html>效果如下：
指定父元素的最后一个 p 元素、(和上一个标签刚好相反，反向找同级同类型的第一个p标签。)
<!DOCTYPE html> <html> <head> <style> p:last-of-type { background:#ff0000; } </style> </head> <body> <h1>这是标题</h1> <p>这是第一个段落。</p> <p>这是第二个段落。</p> <div> <p>我是段落1</p> <p>我是div中倒数第二个标签，但我是p标签</p> <h6>我是div中最后一个标签，但不是p标签</h6> </div> <p>这是第三个段落。</p> <p>这是第四个段落。</p> </body> </html>效果图如下：
指定属于其父元素的最后一个子元素的 p 元素的背景色：（找同辈的最小儿子，如果是p标签改变颜色，如果不是找下一辈。和 last-of-type区别， last-of-type是同辈从后往前找直到找到第一个p便签，没有去下一辈找。）
p:last-child { background:#ff0000; } <h1>这是标题</h1> <p>这是第一个段落。</p> <p>这是第二个段落。</p> <div> <p>我是段落1</p> <p>我是div中倒数第二个标签，但我是p标签</p> <h6>我是div中最后一个标签，但不是p标签</h6> </div> <p>这是第三个段落。</p> <p>这是第四个段落。</p>
规定属于其父元素的第三个子元素的每个 p 的背景色。(同辈里找老三，如果是p就改变颜色，不是去下一辈找老三)。
p:nth-child(3) { color: red; } <p>我是段落1</p> <p>我是段落2</p> <a href="#"></a> <p>我是段落3</p> <p>我是段落4</p> <div> <p>我是段落5</p> <p>我是段落6</p> <p>我是段落7</p> <p>我是段落8</p> </div> <p>这是第三个段落。</p> <p>这是第四个段落。</p>规定属于其父元素的第三个 p 元素的每个 p：(和nth-child(3)区别这个找第三个p标签，可以隔着别的标签。)
<style> p:nth-of-type(3) { color: red; } </style> <p>我是段落1</p> <p>我是段落2</p> <a href="#">我是段落</a> <p>我是段落3</p> <p>我是段落4</p> <div> <p>我是段落5</p> <p>我是段落6</p> <p>我是段落7</p> <p>我是段落8</p> </div> <p>这是第三个段落。</p> <p>这是第四个段落。</p>
规定属于其父元素的第三个子元素的每个 p 元素，从最后一个子元素开始计数：（同辈从后往前找，还必须是倒数第三个位置且是P标签就改变样式）
p:nth-last-child(3) { color: red; } <p>我是段落1</p> <p>我是段落2</p> <a href="#">我是段落</a> <p>我是段落3</p> <p>我是段落4</p> <div> <p>我是段落5</p> <p>我是段落6</p> <p>我是段落7</p> <p>我是段落8</p> </div> <p>这是第三个段落。</p> <p>这是第四个段落。</p>
规定属于其父元素的第三个 p 元素的每个 p，从最后一个子元素开始计数：(这个就不固定位置，同级别从后往前找第3个p标签)
p:nth-last-of-type(3) { color: red; } <p>我是段落1</p> <p>我是段落2</p> <a href="#">我是段落</a> <p>我是段落3</p> <p>我是段落4</p> <div> <p>我是段落5</p> <p>我是段落6</p> <p>我是段落7</p> <p>我是段落8</p> </div> <p>这是第三个段落。</p> <p>这是第四个段落。</p>
规定属于其父元素的唯一子元素的每个 p 元素：（每一代的独生子可以接受传承。）
p:only-child { color: red; } <p>我是段落2</p> <a href="#">我是段落</a> <div> <p>我是段落5</p> </div> <div> <p>这是段落。</p> <h6>这是段落。</h6> </div>指定属于父元素的特定类型的唯一子元素的每个 p 元素：（举个例子每代可以有几个孩子，但是选定只能由一个男孩子，这个独生的男孩子可以接受传承）
p:only-of-type { color: red; } <p>我是段落2</p> <a href="#">我是段落</a> <div> <p>我是段落5</p> </div> <div> <p>这是段落。</p> <h6>这是段落。</h6> </div>odd奇数的意思，这个用法是找同级别的所有奇数位置（1,3,5,7.。。）是否为p标签，如果是就改变样式。没有就去下一级.
p:nth-child(even){ 属性：值： }even偶数的意思，这个用法是找同级别的所有奇数位置（2,4,6,8.。。）是否为p标签，如果是就改变样式。没有就去下一级.
p:nth-of-type(even){ 属性：值： } p:nth-of-type(odd){ 属性：值： }这两个相对于上边就是只在同级所有p标签内去区分奇偶，不管其他标签。
p:nth-child(xn+y){ 属性：值： }x和y是用户自定义的，而n是一个计数器，从0开始递增（自己定义选择规则，很方便啊）
1.这些选择器括号里边的可以是数字、关键词或公式。
2.这些选择器所选子元素进行操作，由于都在body标签内，body标签也是父元素，所以说同级别寻找。
3.就分为同级别第几个和同类型第几个两类，同级别意思就是都是一个辈分寻找，第几个就是固定位置去寻找，找到该标签就改变，找不到就去下级别；同类型意思就是同一种标签，这个当然也是在同级别先寻找 ，第几个意思是找到第几个该标签，不用固定位置，这一级别里寻找只要找到第几个该标签就改变样式，没有就去下一级别。
4.这些选择器里的p都是标签的代表，可以是你自定义的特定类型都可以。举例比抽象更容易理解吧。
5.基本上都是对应的，一个固定位置，固定数量，一个只固定数量。然后就是从后边数的
6.总的来说废话较多，但是也相对于比较容易理解吧
