first-child不懂

如圖所示，我要寫成ul li:first-child{background:red;},第一行就變成紅色。如果寫成ul:first-child{background:red;},第一行就沒變化？在這里面，ul不是父元素嗎？這”ul:first-child“不是表示它的第一個子元素嗎？為什么沒作用呢？

天窗的螞蟻

2016-01-03

源自：十天精通CSS3 6-6

關注問題我要回答

1052

操作

收起

3 回答

李曉健回答被采納 +3 積分
2016-01-03

后代選擇器是有空格的 ?ul li:first-child 拆開來看 ?ul是選擇頁面所有的ul標簽 ?ul li是選擇ul下面的所有li標簽 ?ul li:first-child是ul中所有li中的第一個，再來看?ul:first-child ? 一樣拆開來看 ul是選擇頁面所有的ul標簽?ul:first-child是選擇所有ul中的第一個ul，所以這里選擇到的是ul標簽而不是li標簽。

2 回復有任何疑惑可以回復我~

收起回答

天窗的螞蟻提問者

<div> 慕課網 慕課網 慕課網 慕課網 慕課網 慕課網 </div> 那這里面，div span:first-child是不是表示div中所有span中的第一個呢？但是這樣有不對，得寫成div span:nth-child(4)才行。還是有點迷糊

2016-01-03 回復有任何疑惑可以回復我~

李曉健回復天窗的螞蟻提問者

選擇器需要所有條件同時滿足才行，div span:first-child 你這個選擇器 div span會選中div下所有的span標簽，然后你又在span上加了一個first-child 的限制，這些span沒有一個中div的第一個子元素，所以就不會選中任何元素了。而div span:nth-child(4) 這個選擇器中第一個span即是div的子元素，又是div中的第4個子元素，所以就可以選中了。

2016-01-03 回復有任何疑惑可以回復我~

天窗的螞蟻提問者

非常感謝！

2016-01-04 回復有任何疑惑可以回復我~