CSS偽類 偽元素

2021-10-01 21:34:46 字數 1528 閱讀 3055

1.作用

用於向某些選擇器新增特殊的效果

2.語法

selector : pseudo-class

3.舉例 錨偽類

>

>

type

="text/css"

>

a:link

/* 未訪問的鏈結 */

a:visited

/* 已訪問的鏈結 */

a:hover

/* 滑鼠移動到鏈結上 */

a:active

/* 選定的鏈結 */

style

>

head

>

>

>

>

href

="/index.html"

target

="_blank"

>

這是乙個鏈結。a

>

b>

p>

>

>

注釋:b

>

在 css 定義中,a:hover 必須位於 a:link 和 a:visited 之後,這樣才能生效!p

>

>

>

注釋:b

>

在 css 定義中,a:active 必須位於 a:hover 之後,這樣才能生效!p

>

body

>

html

>

4.常用的偽類

屬性描述

:active

向被啟用的元素新增樣式

:focus

向擁有鍵盤輸入焦點的元素新增樣式

:hover

當滑鼠懸浮在元素上方時,向元素新增樣式

:visited

向已被訪問的鏈結新增樣式

:first-child

向元素的第乙個子元素新增樣式

:lang

向帶有指定 lang 屬性的元素新增樣式

1.作用

用於向某些選擇器設定特殊效果

2.語法

selector:pseudo-element

3.舉例 改變段落第一行的元素樣式

>

>

type

="text/css"

>

p:first-line

style

>

head

>

>

>

我是第一行

>

我是第二行

p>

body

>

html

>

4.常用的偽元素

屬性描述

:first-letter

向文字的第乙個字母新增特殊樣式

:first-line

向文字的首行新增特殊樣式

:before

在元素之前新增內容

:after

在元素之後新增內容

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 必須被置...