css3的nth-child和:nth-of-type之间的差异

对于:nth-child选择器，意味着选择一个元素如果：

1. 这是个段落元素
2. 这是父标签的第二个孩子元素

对于:nth-of-type选择器，意味着选择一个元素如果：

1. 选择父标签的第二个段落子元素

<section>
<span>123</span>

<p>我是第1个p标签</p>
<p>我是第2个p标签</p><!-- p:nth-child(2) { color: red; } -->
<p>我是第3个p标签</p><!-- p:nth-of-type(2) { color: red; }
-->
</section>

 

看效果。。。