虛擬類別
CSS 虛擬類別(pseudo-class)的元素,在特殊狀態下被選取的話,會作為關鍵字被加到選擇器裡面。例如 :hover
會讓用戶的滑鼠停在某個元素的時候,套用指定選擇器的樣式。
虛擬類別與 pseudo-elements
能讓你不只能給文件樹(document tree)本身的相關內容套用樣式,還能給諸如瀏覽歷史(:visited
)、內容的狀態(:checked
)、還有滑鼠的位置(像 :hover
就能讓偵測滑鼠是否在元件上)之類的外部相關因素套用樣式。
語法
selector:pseudo-class { property: value; }
基本虛擬類別的目錄
:active
:any
:checked
:default
:dir()
:disabled
:empty
:enabled
:first
:first-child
:first-of-type
:fullscreen
:focus
:hover
:indeterminate
:in-range
:invalid
:lang()
:last-child
:last-of-type
:left
:link
:not()
:nth-child()
:nth-last-child()
:nth-last-of-type()
:nth-of-type()
:only-child
:only-of-type
:optional
:out-of-range
:read-only
:read-write
:required
:right
:root
:scope
:target
:valid
:visited
規範
Specification |
---|
HTML Standard # pseudo-classes |
Selectors Level 4 |
CSS Basic User Interface Module Level 4 |