樣式規則選取器
作者:Loncer 更多學習資源盡在:wwww.loncer.cn
- HTML selector
就是HTML標籤做為selector,這樣在所有CSS應用的網頁中,所有HTML標籤都會按照所定義的語句來進行顯示.
- Class selector
要將一種HTML標籤所建立的各個網頁元素分成幾類,則要將這個HTML標籤的class設定成為不同的值:
注:如果在樣式表定義的時候,selector直接以(.)後接類名,這條樣式規則就適用於所有class=該類名,的所有HTML標籤. 即把class selector分為了兩類:
- 關聯class selector: HTML標籤名.類名(可以為同一元素定義不同的規則).
- 獨立class selector: .類名(可以為不同的元素定義相同的樣式規則).
- ID selector ID屬性用來定義某一特定的HTML元素,一個網頁檔案中只能有一個元素使用某一ID值.
- 關聯選取器 指用一個空格隔開的兩個或更多的單一選取器組成的字串
例如:
p em {background: yellow}
其中的"p em"就是關聯選取器,它表示標籤對中的標籤對之間的內容的背景為黃色,其它地方出的標籤對中的內容不受影響.
注:關聯選擇定義的規則的優先權高於單一的選取器定義的規則.
- 組合選取器 為了減少樣式表的重複聲明,可以在一條樣式規則定義中組合若干個選取器.
例:H1,H2,H3,H4,H5,H6,TD{color:red}
- 虛擬元素選取器 是指對同一HTML元素的各種狀態和其所包函的部分內容的一種定義方式.
格式如下: HTML元素:虛擬元素周期律{屬性:值}
常用的虛擬元素如下
| 元素名 |
作用 |
| A:active |
選中超連結時的狀態 |
| A:hover |
游標移動到超連結上的狀態 |
| A:link |
沒有任何動作時的狀態 |
| A:visited |
瀏覽過的超連結狀態 |
| P:first-line |
段落中的第一行文本 |
| P:first-letter |
段落中的第一個字母 |
類別選取器可以和虛擬元素一起使用:
HTML元素.類名:虛擬元素 {屬性:值}
