偽類選擇器

2022-08-01 15:03:13 字數 1272 閱讀 7544

doctype html

>

<

html

>

<

head

>

<

meta

charset

="utf-8"

>

<

title

>

title

>

<

style

type

="text/css"

>

/*偽類專門用來表示元素的一種特殊的狀態

當我們需要為處在這些特殊狀態的元素設定樣式時,就可以使用偽類

1.正常鏈結

表示普通的鏈結,沒訪問過的鏈結

a:link

2.訪問過的鏈結

a:visited(只能定義字型顏色)

表示訪問過的鏈結

3.滑鼠滑過的鏈結

a:hover

4.正在點選的鏈結

a:active

瀏覽器通過歷史記錄來判斷乙個鏈結是否訪問過

由於涉及到使用者的隱私問題,所以使用visited偽類只能設定字型的顏色

*/a:link

a:visited

a:hover

a:active

p:hover

/*1.獲取焦點:

:focus

2.制定元素前

:before

3.制定元素後

:after

4.選中的元素

::selection

文字框獲取焦點以後修改背景顏色為黃色

*/input:focus

/*為p標籤中選中的內容使用樣式

可以使用::selection為類

*/::selection

style

>

head

>

<

a href

="www.baid.com.cn"

>123

a>

<

a href

="www.baiu.com.cn"

>123

a>

<

p>我是乙個p標籤

p>

<

input

type

="text"

/>

<

body

>

body

>

html

>

屬性選擇器,偽類選擇器,偽元素選擇器

屬性選擇器 1doctype html 2 html lang en 3 head 4 meta charset utf 8 5 title 屬性選擇器 title 6 style 7 屬性匹配 8 label for 12 屬性名匹配 13 label for pwd 17 以什麼結尾匹配 18 ...

偽類選擇器

作用根據連線的不同狀態可以以不同的方式顯示 偽類是css 用於向某些選擇器新增特殊的效果。a標籤中有四個 link visited hover active 用法示例 a link 未訪問的連線 顏色可以自定義 a visited 已訪問的連線 hover 滑鼠移動到連線上時顯示的效果 a acti...

偽類選擇器

偽類選擇器 用來設定 某些元素在特殊情況下的屬性 例如 超連結在訪問之後的樣式,文字框獲得輸入焦點後的樣式,文字被選中後的樣式。等 1 visited 這個偽類選擇器用於 超連結。指的是 訪問之後的超連結的樣式。只能修改顏色。3 link 普通超連結的樣式 可以設定顏色 背景顏色。等等 4.hove...