CSS3是一種用于網頁設計的樣式表語言，它具有豐富的選擇器，這些選擇器可以幫助我們更精確地指定要樣式化的HTML元素。下面將介紹一些常用的CSS3選擇器，并給出相應的代碼示例。
- 元素選擇器（Element Selector）
元素選擇器是最基本的選擇器，可以選擇HTML文檔中的特定元素進行樣式化。例如，要將所有的段落元素（
）的文字顏色設置為紅色，可以使用以下代碼：
p {
color: red;
}
登錄后復制
- 類選擇器（Class Selector）
類選擇器可用于選擇具有相同類名的元素。通過為元素添加class屬性，我們可以將其與相應的樣式規則關聯起來。例如，要將所有具有”class1″類的元素的背景顏色設置為黃色，可以使用以下代碼：
.class1 {
background-color: yellow;
}
登錄后復制
- ID選擇器（ID Selector）
ID選擇器與類選擇器類似，都是用于選擇指定的元素。不同的是，ID選擇器選擇的是具有唯一ID的元素。通過為元素添加id屬性，我們可以將其與相應的樣式規則關聯起來。例如，要將具有”id1″的元素的字體大小設置為20像素，可以使用以下代碼：
#id1 {
font-size: 20px;
}
登錄后復制
- 偽類選擇器（Pseudo-class Selector）
偽類選擇器可根據元素的狀態或位置選擇元素，從而實現對元素的不同樣式化。常用的偽類選擇器有:hover、:visited、:first-child等。例如，要將鼠標懸停在所有鏈接上時，鏈接文字變為紅色，可以使用以下代碼：
a:hover {
color: red;
}
登錄后復制
- 屬性選擇器（Attribute Selector）
屬性選擇器可根據元素的屬性選擇元素進行樣式化。例如，要將所有具有”title”屬性的圖片的邊框顏色設置為綠色，可以使用以下代碼：
img[title] {
border: 1px solid green;
}
登錄后復制
- 子選擇器（Child Selector）
子選擇器可用于選擇某個元素的直接子元素。例如，要選擇所有列表（）中的直接子項（），并將它們的背景顏色設置為藍色，可以使用以下代碼：
ul > li {
background-color: blue;
}
登錄后復制
- 否定選擇器（Negation Selector）
否定選擇器可從一組元素中去除指定的元素進行樣式化。例如，要選擇除了具有”class1″類的所有元素以外的元素，并將它們的文字顏色設置為灰色，可以使用以下代碼：
:not(.class1) {
color: gray;
}
登錄后復制
以上介紹了一些常用的CSS3選擇器，它們能夠幫助我們更準確地選擇和樣式化HTML元素。通過靈活應用這些選擇器，我們可以輕松地實現網頁設計的各種效果。
