nth-child（）和nth-of-type区别
1 .c p:nth-child（2）：在C这个类下，找某个父元素下的第2个子元素，看是否是p 如果是，p元素身上加样式，不是表示失效【如果C 下面有多个子孙，挨个寻找 ，可以命中多个子孙的子元素】
2 .c p:nth-of-type （2）：与上面类似，不同的是 type是寻找第二个p元素，如果不是它还会继续找 知道找到第二个
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <link rel="stylesheet" href="index.css"> 7 <style> 8 .c{ 9 margin: 10px auto; 10 11 border:1px solid red; 12 width: 600px;height: 800px; 13 } 14 h1,p{ font-size: 40px;line-height: 80px;} 15 16 .c p:nth-last-child(-n+2){ 17 background: red; 18 } 19 20 </style> 21 </head> 22 <body> 23 24 <div class="c"> 25 <h1>h1</h1> 26 <p>第一个</p> 27 <h1>h1 2</h1> 28 <p>第2个</p> 29 <h1>h1 2</h1> 30 <p>第3个</p> 31 <div class="d"> 32 <p>1</p> 33 <h1>h1 3</h1> 34 <p>2</p> 35 <p>3</p> 36 <h1>h1 2</h1> 37 </div> 38 </div> 39 40 </body> 41 </html>