CSS 選擇器是一種用于選擇 HTML 元素并將屬性應用于它們的工具。它有很多種類型,我們來看一下常見的幾種。
/* 元素選擇器 */ p { color: red; } /* id 選擇器 */ #header { background-color: gray; } /* 類選擇器 */ .intro { text-align: center; } /* 屬性選擇器 */ a[target="_blank"] { font-weight: bold; } /* 偽類選擇器 */ a:hover { color: blue; }
元素選擇器是最基本的選擇器類型,通過標簽名匹配元素。例如上面的例子,代碼會選中所有的 p 標簽元素,并將它們的顏色設置為紅色。
id 選擇器可以根據(jù)元素的 id 屬性進行匹配,以 # 符號引導。在示例中,代碼匹配一個 id 為“header”的元素,并將其背景顏色設置為灰色。
類選擇器可以通過元素的 class 屬性進行匹配,以 . 符號引導。在示例中,代碼選中 class 為 “intro”的元素,并將其文本對齊方式設置為居中。
屬性選擇器可以通過元素的屬性名和屬性值進行匹配。在示例中,代碼選中帶有 target="_blank" 屬性的 a 標簽元素,并將其字體加粗。
偽類選擇器可以根據(jù)元素在特定狀態(tài)下的樣式應用來匹配元素。在示例中,代碼通過匹配鼠標懸停在 a 標簽元素上來將其顏色設置為藍色。
以上是幾種常見的 CSS 選擇器類型,每種都有自己的特定用途。在使用時可以根據(jù)需要靈活選用。