属性选择器:
选择符 | 说明 |
---|---|
E [ att ] | 选择具有att属性的E元素 |
E [ att=“val” ] | 选择具有att属性,且属性值为val的E元素 |
E [ att^=“val” ] | 匹配具有alt属性,且值以val开头的E元素 |
E [ att$=“val” ] | 匹配具有alt属性,且值以val结尾的E元素 |
E [ att*=“val” ] | 匹配具有alt属性,且值含有val开头的E元素 |
类选择器、属性选择器、伪类选择器的权重为10
(此图以选中属性为class且值以nn开头的列表项,设置其背景色)
结构伪类选择器:
选择符 | 说明 |
---|---|
E:first-child | 匹配父元素中第一个子元素E |
E :last | 匹配父元素中最后一个子元素E |
E :nth-child(n) | 匹配父元素中的第n个子元素E |
E :first-of-type | 指定类型E的第一个 |
E :last-of-type | 指定类型E的最后一个 |
E:first-child | 指定类型E的最后一个 |
n可以是数字、关键字(even偶数、odd奇数)、公式
(以 E:first-child E:first-child 为例 )
伪元素选择器:
选择符 | 说明 |
---|---|
::befor | 在元素内部前面插入内容 |
::after | 在元素内部后面插入内容 |
伪元素和标签选择器一样,权重为1
(1)befor、after必须有content属性
(2)这两个选择符,会创建一个行内元素
可用display:block;转化为块级元素
(示例:)