基本选择器选择器名 称实 例描 述版 本
* 通用选择器（universal selectors） * 匹配所有的元素 2.1
e 标签选择器（type selectors） p 匹配所有的 <p> 1
.class 类选择器（class selectors） .nav 匹配所有 class=nav 的元素 1
#id id选择器（id selectors） #wrapper 匹配所有 id=wrapper 的元素 1
e[attr] 属性选择器（attribute selectors） a[data-url] 匹配所有 data-url 属性的 <a> 的元素 2.1
e[attr=val] 属性选择器（attribute selectors） a[data-url='http'] 匹配所有 data-url=http 属性的 <a> 的元素 2.1
e[attr~=val] 属性选择器（attribute selectors） a[data-url~='http'] 匹配所有 data-url 属性包含 http 的 <a> 元素 2.1
e[attr^=val] 属性选择器（attribute selectors） a[data-url^='http'] 匹配所有 data-url 属性以 http 开头的 <a> 元素 3
e[attr$=val] 属性选择器（attribute selectors） a[data-url$='http'] 匹配所有 data-url 属性以 http 结尾的 <a> 元素 3
e[attr*=val] 属性选择器（attribute selectors） a[data-url*='http'] 匹配所有 data-url 属性包含 http 的 <a> 元素 3
e f 后代选择器（descendant selectors） p p 匹配所有 <p> 元素下所有 <p> 元素 1
e > f 子选择器（child selectors） p p 匹配所有 <p> 元素下所有子 <p> 元素 2.1
e + f 相邻兄弟选择器 label + input 匹配所有 <label> 元素同级的第一个 <input> 元素 2.1
e ~ f 兄弟选择器 label ~ input 匹配所有 <label> 元素同级的所有 <input> 元素 3
s1,s2,..... 选择器分组 label,input 匹配所有 <label>,<input> 元素 1
伪类和伪元素 伪类（pseudo-classes）用于指定选择器的某种特定状态或条件，伪类在 dom 中并不存在，但对用户却是可见的。
动态伪类（dynamic pseudo-classes） 动态伪类对除了其名称、属性或内容之外的特性的元素进行分类，不会显示在文档源或文树中。
选择器实 例描 述版 本
:link a:link 匹配未被访问的链接 1
:visited a:visited 匹配被访问过的链接 1
:hover a:hover 匹配鼠标指针在其浮动的元素 1
:active a:active 匹配鼠标指针在其上按下的元素 1
:focus input:focus 匹配获得焦点的元素 2.1
目标伪类（the target pseudo-classes） 目标伪类指定当前活动的锚，使用目标伪类可以为活动的锚设置样式。
选择器实 例描 述版 本
:target #tab1:target 匹配活动的锚 3
语言伪类（the language pseudo-classes） 语言伪类向带有指定 lang 属性元素添加样式。
选择器实 例描 述版 本
:lang(val) #p:lang(en) 匹配带有指定 lange=en 的 <p> 元素 3
ui元素状态伪类（the ui element states pseudo-classes） ui元素状态伪类主要用于指定表单中的元素状态。
选择器实 例描 述版 本
:enabled input:enabled 匹配启动的元素 3
:disabled input:disabled 匹配禁用的元素 3
:checked input:checked 匹配被选中的元素 3
display 和 visibility 属性对于ui元素状态伪类匹配 enabled/disabled 状态没有影响。结构性伪类（structural pseudo-classes） 结构性伪类用于指定文档的特定结构。
选择器实 例描 述版 本
:root :root 匹配文档的根元素 3
:nth-child(n) :nth-child(n) 匹配其父元素的第 n 个子元素 3
:nth-last-child(n) :nth-last-child(n) 匹配其父类倒数第 n 个子元素 3
:nth-of-type(n) :nth-of-type(n) 匹配其父类第 n 个有着相同选择器的子元素 3
:nth-last-of-type(n) :nth-last-of-type(n) 匹配其父类倒数第 n 个有着相同选择器的子元素 3
:first-child :first-child 匹配其父类元素的第一个子元素 3
:last-child :last-child 匹配其父类元素的最后一个子元素 3
:last-child :last-child 匹配其父类元素的最后一个子元素 3
:first-of-type :first-of-type 匹配其父类元素第一个有着相同选择器的子元素 3
:last-of-type :first-of-type 匹配其父类元素最后一个有着相同选择器的子元素 3
:only-child :only-child 匹配其父类的唯一子元素 3
:only-of-type :only-child 匹配其父类的唯一有着相同选择器的子元素 3
:empty :empty 匹配没有子元素（包括文字节点）的元素 3
:nth-child(n)、:nth-last-child(n)、:nth-of-type(n)、:nth-last-of-type(n) 中 n 是从 0 开始的整数，表达式可写成 an+b， a 和 b 是 0 或正整数，表达式的写法相当于把每 a 个子元素分成一组，取每组的第 b 个元素；取第奇数、偶数个子元素可写表达式为 2n+1 或 even、2n 或 odd。 否定伪类是用来选择所有非指定类型元素的其他元素。
选择器实 例描 述版 本
:not(s) input:not([type=text]) 匹配所有非指定类型的其他元素 3
伪元素 伪元素（pseudo-elements）是指不存在与文档树中的抽象。
选择器实 例描 述版 本
::first-line ::first-line 匹配元素文本内容的首行 1
::first-letter ::first-letter 匹配元素文本内容的首个字母 1
::before ::before 元素之前 2.1
::after ::after 元素之后 2.1
在 css 1 和 css 2 中，伪类选择器中只有一个 :，而 css 3 变为两个 ::，是为了区分伪类与伪元素，目前这两个写法效果一致。::before 与 ::after 必须设置 content 属性，否则元素不能生效。
优先级和权重 css 中的权重分别为 4 个等级：
内联样式（html 文档中的 style 属性）
id 选择器
类、伪类、属性选择器
元素、伪类元素
这 4 个等级由高到低代表不同的优先级，!important 写在 css 规则后，可以将对应的规则提升到最高权重。
相关推荐：
css选择器实例分享
css选择器的新用法详解
css选择器字段解析的实现方法
以上就是css选择器的优先级和权重分析的详细内容。