:first-child 選擇器用于選取屬于其父元素的首個子元素的指定選擇器。——w3school
嗯，乍一看好像說的不是很明白，是以這個選擇器很容易讓人誤解，通常會有兩種誤解：
誤解一：認為E:first-child選中E元素的第一個子元素。
誤解二：認為E:first-child選中E元素的父元素的第一個E元素。
你是不是也曾這樣了解這個選擇器或者現在仍然這樣了解？以上兩種了解都是錯誤的，為了證明上面兩種了解是錯的，看看下面的執行個體
效果是這樣的：
很明顯，照第一種了解，應該隻有第一個a元素字型顔色變紅，然而事實上全部變紅了。
照第二種了解，div裡的第一個a元素字型應該是紅色的，事實證明這種了解也是錯的。
OK，正确的了解應該是：隻要E元素是它的父級的第一個子元素，就選中。它需要同時滿足兩個條件，一個是“第一個子元素”，另一個是“這個子元素剛好是E”。
效果：
類似容易誤解的結構選擇器還有:nth-child()、:nth-last-child、:only-child，在平時的開發中需要注意一下。