一.子元素的伪类
1):first-child 可以选中第一个子元素
2):last-child 可以选中最后一个子元素
3):nth-child 可以选中任意一个子元素
该选择器可以指定一个参数,指定要选中第几个元素
even 表示偶数位置的子元素
odd 表示奇数位置的子元素
4)
:first-of-type
:last-of-type
:nth-of-type
和:first-child这些非常相似,只不过child,是在所有子元素中排列,而type:是在当前类型 的元素中排列。
二.兄弟元素选择器
1)后一个兄弟元素选择器
作用:可以选中一个元素后紧挨着的指定的兄弟元素
语法:前一个 + 后一个
2)选中后边的所有兄弟元素
语法:第一个 ~ 后边所有
三.否定伪类
1)否定伪类
作用:可以从已选中的元素中剔除某些元素
语法: :not(选择器)
四.样式的继承
像儿子可以继承父亲的遗产一样,在CSS中,祖先元素上的样式,也会被他的后代元素所继承。
利用继承,可以将一些基本的样式和设置给祖先元素,这样所有的后代元素会将自动继承这些样式。
但是,并不是所有的样式都会被子元素所继承,比如:背景相关样式都不会被继承
五.选择器的优先级
当使用不同的选择器,选中同一个元素时并且设置相同的样式时,这时样式之间产生了冲突,最终到底采用哪个选择器定义的样式,由选择器的优先级(权重)决定。
优先级高的优先显示
优先级规则:
内联样式,优先级1000
id选择器,优先级 100
类和伪类,优先级 10
元素选择器,优先级 1
通配*选择器,优先级0
继承的样式,没有优先级
当选择器中包含多种选择器时,需要将多种选择器的优先级相加然后在比较,但是注意,选择器优先级计算不会超过他的最大的数量级。
并集选择器的优先级是单独计算
div,p,#p1,.hello{ }
可以在样式的最后,添加一个 !important,则此时该样式将会获得一个最高的优先级,将会优先于所有的样式显示甚至超过内联样式,但是在开发中很少使用。
六.a的伪类顺序
:link
:visited
:hover
:active
这四个选择器的优先级是一样的