CSS中的伪类选择器:nth-child和:nth-of-type
:nth-child和:nth-of-type都可以选择父元素下的子元素。那么他们的区别是什么？
我们先来看第一种情况：
<div> <p>第一个段落</p> <p>第二个段落</p> </div>
这时候用p:nth-child(2)和p:nth-of-type(2)获取的都是"第二个段落"。
那么再看第二种情况，我们在第一个p前面加一个<h4>
<div> <h4>一个标题</h4> <p>第一个段落</p> <p>第二个段落</p> </div>
这时候用p:nth-child(2)获取的是"第一个段落"。
而用p:nth-of-type(2)获取的是"第二个段落"。
这就是:nth-child和:nth-of-type的区别。
p:nth-child(2)要满足两个条件：
1.父元素的第二个子元素
2.这个子元素必需是p
而p:nth-of-type(2)则选择的是：
1.父元素的第二个为p的子元素
值得一提的是 jquery并不支持:nth-of-type