做練習時發現nth-of-type()并不是我了解的那樣選擇，是以做了點實驗，不想看過程的可在結尾直接看結論。
<body>
<div>
<p>1</p>
</div>
<p class="p">2</p>
<p>3</p>
<p class="p">4</p>
</body>
當選擇器是p标簽時，選擇第一個，css代碼：
p:nth-of-type(1) {
background-color: red;
}
選中的是div中第一個p和body下第一個p
當選擇器是.p類，選擇第一個，css代碼：
.p:nth-of-type(1) {
background-color: red;
}
結果是隻選中了body下的第一個p
由此可以看出，nth-of-type是從選擇器所比對元素标簽開始選的。
.p類選擇第二個，css代碼：
.p:nth-of-type(2) {
background-color: red;
}
結果是一個也沒選中
當改成選第三個時，body下第三個p被選中
但是它不是body下第三個.p
由此看出，不是按css選擇器所得到的元素集合來排數的。
結論
css選擇器:nth-of-type()是先找到css選擇器選擇到的元素，找到後，在平級dom節點中，根據括号裡的值，選擇第n個标簽，注意是标簽，不是css選擇器所比對元素集合的第n個。若第n個标簽也符合css選擇器，則選中，若不符合，則選不中。