:first-child 選擇器用於選取屬於其父元素的首個子元素的指定選擇器。——w3school
嗯，乍一看好像說的不是很明白，因此這個選擇器很容易讓人誤解，通常會有兩種誤解：
誤解一：認為e:first-child選中e元素的第乙個子元素。
誤解二：認為e:first-child選中e元素的父元素的第乙個e元素。
你是不是也曾這樣理解這個選擇器或者現在仍然這樣理解？以上兩種理解都是錯誤的，為了證明上面兩種理解是錯的，看看下面的例項
乙個鏈結效果是這樣的：乙個鏈結
乙個鏈結
乙個鏈結
很明顯，照第一種理解，應該只有第乙個a元素字型顏色變紅，然而事實上全部變紅了。
乙個段落效果是這樣的：乙個鏈結
乙個鏈結
乙個鏈結
乙個鏈結
照第二種理解，div裡的第乙個a元素字型應該是紅色的，事實證明這種理解也是錯的。
ok，正確的理解應該是：只要e元素是它的父級的第乙個子元素，就選中。它需要同時滿足兩個條件，乙個是「第乙個子元素」，另乙個是「這個子元素剛好是e」。
.demo的第乙個子元素是div效果：第乙個span第乙個段落p第二個span
乙個鏈結第乙個i元素
乙個鏈結第二個i元素
乙個鏈結
類似容易誤解的結構選擇器還有:nth-child()、:nth-last-child、:only-child，在平時的開發中需要注意一下。
by：王美建 from：
那些年之cordova踩過的坑
私人筆記 如果安裝的是crosswalk with cordova 整合版的話 新增外掛程式的方法是 需要的環境 nodejs git 1 npm安裝 plugman npm install g plugman2 cd到當前專案根目錄 cd f music3 安裝ngcordova外掛程式 這一步千...
uniapp之那些年踩過的坑
這裡我把一些坑列舉出來了?這裡有兩點 使用this.set obj key 值 或 者thi s.set obj,key,值 或者this.set ob j,ke y,值 或者th is.set array,index,值 像是處理vue底層監聽不到資料變化的解決方式 要用資料巢狀陣列，而不是物件包...
那些年踩過的CSS坑
1 img 標籤中的alt 與title的區別 title 滑鼠滑過時顯示的文字提示。對seo優化的影響 搜尋引擎對理解是通過alt屬性，所以在alt屬性中包含關鍵字的簡要文字說明，也是頁面優化的一部分。2 padding與margin區別 padding是控制項的內容相對控制項的邊緣的邊距，mar...