css中的伪类选择器有哪些
1 伪类选择器① 动态伪类选择器(5个):link选择地址没有被访问过的超链接元素:visited选择地址被访问过的超链接元素:hover选择鼠标悬停在上面的元素。:active选择鼠标在上面并且按键按下不松手的元素:focus选择获取焦点的元素。② 目标伪类选择器(1个):target选择当前锚点指向的元素。③ 语言伪类选择器 (1个,了解)lang()根据语言选择元素(lang 属性的值)④
·
1 伪类选择器
① 动态伪类选择器(5个)
:link 选择地址没有被访问过的超链接元素
:visited 选择地址被访问过的超链接元素
:hover 选择鼠标悬停在上面的元素。
:active 选择鼠标在上面并且按键按下不松手的元素
:focus 选择获取焦点的元素。
② 目标伪类选择器(1个)
:target 选择当前锚点指向的元素。
③ 语言伪类选择器 (1个,了解)
lang() 根据语言选择元素(lang 属性的值)
④ UI元素伪类选择器(3个)
:enabled 选择可以使用的表单控件(没有设置disabled 属性)
:disabled 选择不可以使用的表单控件(设置了disabled属性)
:checked 选择到被选中的单选按钮、复选框、下拉选项(option)
⑤ 结构伪类选择器(12个)
:root 选择到根元素
:empty 选择到既不能有文本内容也没有后代元素的元素
:first-child 所有兄弟元素中的第一个
:last-child 所有兄弟元素中的最后一个
:nth-child(n) 所有兄弟元素中的第n个,n是个数字
:nth-last-child(n) 所有兄弟元素中的倒数第n个,n是个数字
:only-child 没有兄弟元素的元素
:first-of-type 所有兄弟元素中同类型的第一个
:last-of-type 所有兄弟元素中同类型的最后一个
:nth-of-type(n) 所有兄弟元素中同类型的第n个,n是个数字
:nth-last-of-type(n) 所有兄弟元素中同类型的倒数第n个,n是数字
:only-of-type 没有同类型兄弟元素
⑥ 否定伪类选择器(1个)
:not(选择器) 排除满足小括号中选择器的元素
2 伪元素选择器(6个)
::first-letter 选择元素中第一字母
::first-line 选择元素中第一行
::after 给元素动态创建最后一个子元素
::before 给元素动态创建第一个子元素
::placeholder 用于设置输入框或文本域中placeholder属性设置的文字的样式
::selection 用于设置被鼠标选中的文字的样式
3 选择器的优先级(权重)
ID选择器 > 类名选择器、伪类选择器、属性选择器 > 标签名选择器、伪元素选择器 > 全局选择器
更多推荐
已为社区贡献1条内容
所有评论(0)