CSS選擇器非常有用,它使我們可以指定特定元素應該有的樣式。但有時候我們需要選擇頁面中的第一個元素,并為其應用特定的樣式。這時候,我們可以使用CSS的:first-child偽類選擇器。
p:first-child { color: red; font-size: 20px; }
以上代碼將選擇頁面中所有第一個p元素,并將它們的字體顏色設置為紅色,字體大小設置為20像素。注意,:first-child偽類只能選擇各自的父元素中的第一個子元素,而不是文檔中所有的第一個元素。
如果我們只想選擇第一個特定類型的元素,不管它是否是其父元素的第一個子元素,我們可以使用:nth-of-type偽類選擇器:
p:nth-of-type(1) { color: blue; font-size: 20px; }
這段代碼將選擇頁面中所有類型為p的第一個元素,并將它們的字體顏色設置為藍色,字體大小設置為20像素。請注意,:nth-of-type偽類選擇器可以使用一個參數來指定元素的類型和位置。
下一篇css選擇器腦圖