nth-child() 是一個僞類選擇器,它並不會按照標籤的順序進行選擇,而是按照順序進行選擇
#例子:
<!DOCTYPE html>
<html>
<head>
<style>
p:nth-child(8) # 先根據順序選擇第8行,在檢查它是否是p元素,如果是p就是紅色,父元素是body
{
background:#ff0000;
}
</style>
</head>
<body>
<h1>這是標題</h1>1
<p>第一個段落。</p>2
<p>第二個段落。</p>3
<p>第三個段落。</p>4
<p>第四個段落。</p>5
<p><b>註釋:</b>Internet Explorer 不支持 :nth-child() 選擇器。</p>6
<h1>這是標題</h1>7
<p>第一個段落。</p>8
<p>第二個段落。</p>9
<p>第三個段落。</p>10
<p>第四個段落。</p>11
</body>
</html>