nth-child(1)等于first-child
nth-of-type(1)等于first-of-type
如圖所示：
圖1-1
圖1-2
需要注意的是，最好指定父級元素，如.ct>p，要不然，不同級的子級元素都會被選中。如圖2所示：
圖2
兩者還有一處不同是，如果選擇器這樣寫
.ct>p:nth-child(2){
color:red;
}
那么這個元素要滿足兩個條件才會被選中，1是他是.ct的子標簽的第二個；2是他還要是<p>標簽。兩個條件的關系是且，缺一不可。
如圖3所示：第一個元素是<div>，不符合要求，所以沒有被選中。
圖3
如圖4，改選第二個子元素，就符合選擇器的要求了。
圖4
而nth-of-type()，就沒這個要求了。
拿上面的例子來說，如果第一個元素不是<h3>的話，他會在同父級元素下（選擇器上設置了父級）繼續找<h3>標簽，直到找到為止。如果沒有設置父級，那么他會在每個子級中尋找，如圖2所示。
update，發現一個問題，就是nth-of-type()前如果是類名的話，他也要符合兩個條件，一是類名相同，二是在其相同標簽中位于第X位，才能被選擇器選中。
如下圖所示：
圖5
圖6
