CSS 伪类选择器

简介: CSS 伪类选择器

E:link

链接伪类选择器

选择匹配的E元素,而且匹配元素被定义了超链接并未被访问过,常用于链接锚点上


E:visited

链接伪类选择器

选择匹配的E元素,而且匹配元素被定义了超链接并已被访问过,常用于链接锚点上


E:active

用户行为伪类选择器

选择匹配的E元素,而且匹配元素被激活,常用于链接锚点和按钮上


E:hover

用户行为伪类选择器

选择匹配的E元素,而且用户鼠标停留在元素E上。


E:focus

用户行为伪类选择器

选择匹配的E元素,且匹配元素获得焦点


E:target

选择匹配的E元素,而且匹配元素被相关URL指向


Eg:

另一种是手工在文档中指定lang属性

E:checked

选中状态伪类选择器

匹配选中的复选按钮或单选按钮表单元素


E:enabled

启用状态伪类选择器

匹配所有启用的表单元素


E:disabled

不可用状态伪类选择器

匹配所有禁用的表单元素


E:firse-child

E:first-child


作为父元素的第一个子元素的元素E。与E:nth-child(1)等同

作为父元素的第一个子元素的元素E。与E:nth-child(1)等同


E:last-child

E:last-child


作为父元素的最后一个子元素的元素E。与E:nth-last-child(1)等同

作为父元素的最后一个子元素的元素E。与E:nth-last-child(1)等同


E:root

E:root


选择匹配元素E所在文档的跟元素。在HTML文档中,跟元素始终是html,此时该选择器与html类型选择器匹配的内容相同。

选择匹配元素E所在文档的跟元素。在HTML文档中,跟元素始终是html,此时该选择器与html类型选择器匹配的内容相同。


E F:nth-child(n)

E F:nth-child(n)


选择父元素E的第N个子元素F。其中N可以是整数(1、2、3)、关键字(even、odd)、可以是公式(2n+1、-n+5)而且n值起始值为1

选择父元素E的第N个子元素F。其中N可以是整数(1、2、3)、关键字(even、odd)、可以是公式(2n+1、-n+5)而且n值起始值为1


E F:nth-last-child(n)

E F:nth-last-child(n)


选择元素E的倒数第N个子元素f。此选择器与E F:nth-child(n)选择器计算顺序刚好相反,但使用方法都是一样的,其中:nth-last-child(1)始终匹配的时最后一个元素,与:last-child等同

选择元素E的倒数第N个子元素f。此选择器与E F:nth-child(n)选择器计算顺序刚好相反,但使用方法都是一样的,其中:nth-last-child(1)始终匹配的时最后一个元素,与:last-child等同


E:nth-of-type(n)

E:nth-of-type(n)


E:not(F)

匹配所有除元素F外的E元素


相关文章
|
7天前
|
前端开发
CSS——通过伪类来自定义四个角边框
CSS——通过伪类来自定义四个角边框
12 3
|
5天前
|
前端开发
HTML+CSS基础知识(2)选择器的使用、盒子模型的讲解、列表的使用
该博客文章详细介绍了HTML和CSS的基础知识,包括CSS样式的应用方式、语法规则、选择器的使用、盒子模型、内边距、外边距、元素的显示类型以及overflow属性处理溢出内容的方法,并通过代码示例和测试结果截图展示了这些知识点在网页设计中的应用。
HTML+CSS基础知识(2)选择器的使用、盒子模型的讲解、列表的使用
|
2月前
|
前端开发
CSS选择器详解与应用实例
CSS选择器详解与应用实例
127 44
|
6天前
|
XML 前端开发 安全
如何使用 CSS 中的 :root 伪类选择器
如何使用 CSS 中的 :root 伪类选择器
8 0
|
1月前
|
前端开发 JavaScript 算法
CSS【详解】样式选择器的优先级(含提升优先级的方法)
CSS【详解】样式选择器的优先级(含提升优先级的方法)
21 0
CSS【详解】样式选择器的优先级(含提升优先级的方法)
|
2月前
|
前端开发 开发者
CSS伪类选择器:增强内容表现力的利器
CSS伪类选择器:增强内容表现力的利器
23 4
|
1月前
|
前端开发 JavaScript C++
CSS 【详解】样式选择器(含ID、类、标签、通配、属性、伪类、伪元素、Content属性、子代、后代、兄弟、相邻兄弟、交集、并集等选择器)
CSS 【详解】样式选择器(含ID、类、标签、通配、属性、伪类、伪元素、Content属性、子代、后代、兄弟、相邻兄弟、交集、并集等选择器)
26 0
|
1月前
|
前端开发
前端 CSS 经典:好用的 CSS 选择器
前端 CSS 经典:好用的 CSS 选择器
22 0
|
1月前
|
前端开发
CSS2(一):CSS选择器(2)
CSS2(一):CSS选择器(2)
17 0
|
1月前
|
前端开发
CSS2(一):CSS选择器(1)
CSS2(一):CSS选择器(1)
15 0