伪类选择器

241 阅读2分钟

伪类选择器
伪类是不存在的类,特殊的类,多用于描述一个元素的特殊状态,比如: 第一个元素,被点击的元素,鼠标移入的元素
格式:使用英文冒号开始:
伪类的分类:
1:ui伪类 多用于给一个标签的特殊状态添加样式
1.1静态伪类 只能作用于超链接上 a标签
:link a:link给没有访问过得超链接添加样式
:visited a:vasited给已经访问过的超链接添加样式
通常只给已经访问过的超链接添加颜色,为了保护隐私
1.2动态伪类 可以作用在所有标签上:hover鼠标悬停时添加样式
:active激活 鼠标按下但没有松开的情况
:focus获取焦点 表单元素
a标签伪类:link:visited:hover:active love hate爱恨原则要按照lvha的书写顺序,否则无效
结构伪类
获取父元素的子元素
2.1:first-child 获取父元素的第一个子元素
将父元素中所有子元素(不分类别)进行排序,然后选择出第一个子元素
2.2:last-child获取父元素的最后一个元素
将度元素中所有子元素(不分类别)进行排序,然后选择出最后一个子元素
2.3nth-child(n)获取父元素中的n子元素
将父元素中所有子元素进行排,然后选择出第n个子元素
n的取值0到正无穷
n的取值为偶数 2n even选择出偶数的子元素
n取值为奇数 2n+1 odd选择出奇数次项的子元素
3n取值倍数项的子元素
n+3取出重第3子元素开始以后的所有子元素
—n+3取出从第3子元素开始以前的所有子元素
:first-of-type
将父元素中的子元素按类别进行排序,然后选择出符合类别要求的第一个子元素:last-of-type
将父元素中的子元素按类别进行排序 然后选择出符合类别要求的最后一个子元素
:ntn-of-type(n)
将父元素中的子元素按;类别进行排序,然后选择出符合类别要求的第n个子元素