h1 | 类型选择器 | 选择元素的一个类型 |
.className | 类选择器 | 以class属性的值来选择元素,可以在一个页面中出现多个 |
#idName | ID选择器 | 以id属性的值来选择元素,在页面中是唯一的,只能出现一次 |
article h2 | 后代选择器 | 选择指定祖先元素内的后代元素 |
article > h2 | 子元素选择器 | 选择指定父元素内的直接子元素 |
h2 ~ p | 相邻兄弟选择器 | 选择第一个元素后的兄弟元素,两者拥有相同的父元素 |
h2 + p | 子元素选择器 | 选择第一个元素后紧跟的元素,两者拥有相同的父元素 |
a[target] | 目标属性选择器 | 选择一个存在某属性的元素 |
a[href="http://google.com/"] | 属性均等选择器 | 选择一个属性值匹配特定值的元素 |
a[href*="login"] | 属性包含选择器 | 选择一个属性值包含特定值的元素 |
a[href^="https://"] | 属性开头选择器 | 选择一个属性值以特定值开头的元素 |
a[href$=".pdf"] | 属性结尾选择器 | 选择一个属性值以特定值结尾的元素 |
a[rel~="tag"] | 属性间隔选择器 | 选择一个属性值被空白分割成多个单词,且其中一个单词匹配给定值的元素 |
a[lang|="en"] | 属性连接符选择器 | 选择一个属性值被连接符分割成多个单词,且其中一个单词匹配给定值的元素 |
a:link | 链接(link)伪类 | 选择一个用户没有访问过的链接 |
a:visited | 链接(link)伪类 | 选择一个用户访问过的链接 |
a:hover | 行为性伪类 | 选择一个用户将鼠标指针悬浮在上方的元素 |
a:active | 行为性伪类 | 选择一个用户使用中的元素 |
a:focus | 行为性伪类 | 选择一个拥有用户焦点的元素 |
input:enabled | 状态性伪类 | 选择一个处于可编辑状态(默认)下的元素 |
input:disabled | 状态性伪类 | 选择一个通过设置disabled属性而处于不可编辑状态下的元素 |
input:checked | 状态性伪类 | 选择一个被选中的单选或者复选按钮 |
input:indeterminate | 状态性伪类 | 选择一个处于不确定状态下的单选或者复选按钮(可能被选中或者不被选中) |
li:first-child | 结构性伪类 | 选择父元素下的第一个子元素 |
li:last-child | 结构性伪类 | 选择父元素下的最后一个子元素 |
div:only-child | 结构性伪类 | 如果某个元素是它父元素中惟一的子元素,那么将会被匹配 |
p:first-of-type | 结构性伪类 | 选择父元素中同类型的第1个子元素 |
p:last-of-type | 结构性伪类 | 选择父元素中同类型的最后一个子元素 |
img:only-of-type | 结构性伪类 | 若元素为父元素中同类型的唯一元素,则会被匹配 |
li:nth-child(2n+3) | 结构性伪类 | 当父元素中子元素的序列匹配所给数字时会被选中,会以文档树开头作为起点,来计算所有元素 |
li:nth-last-child(3n+2) | 结构性伪类 | 当父元素中子元素的序列匹配所给数字时会被选中,会以文档树开头作为起点,来计算所有元素 |
p:nth-of-type(3n) | 结构性伪类 | 当父元素中子元素的序列匹配所给数字时会被选中,会以文档树开头作为起点,只计算文档树中给定类型的元素 |
p:nth-last-of-type(2n+1) | 结构性伪类 | 当父元素中子元素的序列匹配所给数字时会被选中,会以文档树开头作为起点,只计算文档树中给定类型的元素 |
section:target | 目标伪类 | 选择URI片段标示符的值指向的元素 |
div:empty | 空伪类 | 选择没有任何子元素或者文本的元素 |
div:not(.awesome) | 否定伪类 | 选择不匹配某个状态标示符的元素 |
.alpha:first-letter | 文本伪元素 | 选择元素内文本的第一个字母 |
.bravo:first-line | 文本伪元素 | 选择元素内文本的第一行 |
div:before | 生成的内容 | 在被选择元素前创建伪元素 |
a:after | 生成的内容 | 在被选择元素末尾创建伪元素 |
::selection | 片段伪元素 | 选择通过用户操作所选定或者高亮的部分 |
时间: 2024-10-24 15:04:41