前言:
而今朋友们对“cssnotli”都比较讲究,我们都需要知道一些“cssnotli”的相关知识。那么小编也在网摘上汇集了一些有关“cssnotli””的相关内容,希望各位老铁们能喜欢,我们一起来学习一下吧!CSS2与CSS3中有非常多的伪类,可以用于实现各种强大的、酷炫的功能。有用于选择标签状态的,如:a:link a:hover input:checked input:focus等;也有用于根据结构选择标签的,如:li:first-child li:nth-child()等;甚至还有非常少用,但功能强大的,如:li:not() div:target等等。
CSS2的伪类大汇总:
E:link 动态伪类选择器,用于设置未访问的连接
E:visited 动态伪类选择器,用于设置已访问过的连接
E:hover 动态伪类选择器,用于设置鼠标移到标签上的效果
E:active 动态伪类选择器,用于设置鼠标点到连接上的效果
E:focus 焦点伪类选择器,用于设置输入框获取到焦点时的效果
E:lang(zh-cn) 语言伪类选择器,用于选择设置了对应语言的标签
E:first-child 结构伪类选择器,用于选择第一个子元素
CSS3的伪类大汇总:
E:last-child 结构伪类选择器,用于选择最后一个子元素
E:only-child 结构伪类选择器,用于选择仅有的一个子元素
E:nth-child(n) 结构伪类选择器,用于选择指定位置的某个元素
E:nth-last-child(n) 结构伪类选择器,用于选择倒数指定位置的某个元素
E:first-of-type 选择同类型中的第一个同级兄弟元素E
E:last-of-type 选择同类型中的最后一个同级兄弟元素E
E:only-of-type 选择同类型中的唯一的一个同级兄弟元素E
E:nth-of-type(n) 选择同类型中的第n个同级兄弟元素E
E:nth-last-of-type(n) 选择同类型中的倒数第n个同级兄弟元素E
E:empty 选择没有任何子元素的元素E
E:checked 用于设置单选与复选框的选中项样式
E:enabled 用于设置可用的输入框的样式
E:disabled 用于设置禁用的输入框的样式
E:target 目标伪类选择器,用于设置当前锚点匹配的目标样式
E:not(s) 否定伪类选择器,用于否定某个选择器
E:root 用于选择文档的根元素,html文档根元素永远是<html>标签
这里面有非常多平时较少用到,但是功能强大的伪类。下面以 :checked为例给大家演示一下复选框的样式重置效果。
复选框与单选框在网页中是不能被随意更改外形的,但是可以使用 :checked伪类模仿一个复选框,这样就可以设置成我们想要看到的效果,例如:
要如何实现呢?