css偽類 偽元素

2021-09-30 17:55:50 字數 1643 閱讀 1690

selector:pseudo-element
:first-line

文字首行設定特殊的樣式

:first-letter

文字首字母設定特殊樣式

:before

在元素的內容前面插入新內容

:after

在元素的內容之後插入新的內容

selector : pseudo-class
a:link

未訪問的連線

a:visited

已經訪問過的連線

a:hover

滑鼠移動到連線上

a:active

選定的連線

p:first-child

選擇屬於其父元素的首個子元素的每個p元素

p:last-child

指定屬於其父元素的最後乙個子元素的 p 元素的背景色

:root

文件的根元素

:empty

沒有子元素的元素

:target

當前活動的目標元素

:not(selector)

選擇除 selector 元素之外的元素

:enabled

選擇可用的表單元素

:disable

選擇禁用的表單元素

:checked

選擇被選擇的表單元素

:nth-child(n)

匹配父元素下指定的子元素,在所有子元素中排序n

:nth-last-child

匹配父元素下指定的子元素,在所有子元素中排序n,從後往前數

:nth-child(odd)

匹配父元素下指定的子元素,在所有子元素中排序為偶數

:nth-child(even)

匹配父元素下指定的子元素,在所有子元素中排序為奇數

p:only-child

規定屬於其父元素的唯一子元素的每個 p 元素:

單冒號用於css3偽類

雙冒號用於css3偽元素

偽元素和偽類之所以這麼容易混淆,是因為他們的效果類似而且寫法相仿,但實際上 css3 為了區分兩者,已經明確規定了偽類用乙個冒號來表示,而偽元素則用兩個冒號來表示。但因為相容性的問題,所以現在大部分還是統一的單冒號,但是拋開相容性的問題,我們在書寫時應該盡可能養成好習慣,區分兩者。

如果你的**只需要相容webkit、firefox、opera等瀏覽器,建議對於偽元素採用雙冒號的寫法,如果不得不相容ie瀏覽器,還是用css2的單冒號寫法比較安全。

css偽類,偽元素

偽類作用於整個元素,比如 a link a hover div first child 儘管這些條件都不是基於dom的,但結果沒乙個都是作用於乙個完整的元素,比如整個鏈結,段落,div等等 偽元素作用於元素一部分,比如 p first line p first letter 偽元素作用於元素的一部分...

CSS偽類 偽元素

css偽類用於向某些選擇器新增特殊的效果。錨偽類a link 未訪問的鏈結 a visited 已訪問的鏈結 a hover 滑鼠移動到鏈結上 a active 選定的鏈結 注意 1 在 css 定義中,a hover 必須被置於 a link 和 a visited 之後,才是有效的。2 在 cs...

CSS 偽元素 偽類

link 未訪問的鏈結 visited 已訪問的鏈結 hover 滑鼠移到元素上 active 向被啟用的鏈結新增樣式 focus 獲得輸入焦點的元素 first child 作為某元素的第乙個子元素的元素 lang 向帶有指定lang屬性的元素新增樣式 在 css 定義中,a hover 必須被置...