CSS3 的 `:first-of-type` 選擇器可以定位特定類別的第一個實例嗎？

CSS3 :first-of-type 選擇器可以選擇特定的類別名稱嗎？

雖然 CSS3 :first-of-type 選擇器可以選擇特定類型（例如 div、p）的第一個元素，不能單獨使用它來定位類別名稱的第一次出現。這是因為將類別選擇器（或類型選擇器）與:first-of-type 一起使用意味著選擇一個元素：

• 具有指定的類別（或類型）
• 是它的兄弟元素中該類型的第一個元素

但是，CSS 中沒有固有的:first-of-class選擇器專門選擇第一個類別的實例。

解決方法

要實現此功能，可以採用解決方法：

.myclass1 { color: red; }
.myclass1 ~ .myclass1 { color: /* default or inherited from parent */; }

此解決方法利用相鄰的同級組合器(~) 對除第一個之外的所有出現的.myclass1 進行樣式設定。第一個 .myclass1 將從其父 div 繼承其顏色（或預設為瀏覽器預設值）。

有關此解決方法的更多見解和視覺插圖，請參閱：

• [W3Schools ：使用孩子和兄弟姐妹選擇器](https://www.w3schools. com/css/sel_combinators.asp)
• [CSS技巧：設計第一位兄弟姊妹的樣式](https://css-tricks.com/styling-first-sibling /)

以上是CSS3 的 `:first-of-type` 選擇器可以定位特定類別的第一個實例嗎？的詳細內容。更多資訊請關注PHP中文網其他相關文章！