css基本选择器

css选择器

• 基本选择器（* element #id .class a,b）
• 层级选择器  (后代 子代 兄弟 通用)
• 伪类选择器  （:link :active :hover :focus :target :lang....... ）
• 伪元素选择器(::before  ::after)
• 属性选择器(element[])

因时间原因以上选择器中简单的选择器不加叙述了

  此处只介绍基本选择器 的优先级

当同一个元素有多个声明的时候，优先级才会有意义。因为每一个直接作用于元素的CSS规则总是会接管/覆盖（take over）该元素从祖先元素继承而来的规则

下面列表中，选择器类型的优先级是递增的：

1. 类型选择器（type selectors）（例如, h1）和 伪元素（pseudo-elements）（例如, ::before）
2. 类选择器（class selectors） (例如,.example)，属性选择器（attributes selectors）（例如, [type="radio"]），伪类（pseudo-classes）（例如, :hover）
3. ID选择器（例如, #example）

通配选择符（universal selector）(*), 关系选择符（combinators） (+, >, ~, ' ')  和 否定伪类（negation pseudo-class）(:not()) 对优先级没有影响。（但是，在 :not() 内部声明的选择器是会影响优先级）。

给元素添加的内联样式 (例如, style="font-weight:bold") 总会覆盖外部样式表的任何样式 ，因此可看作是具有最高的优先级。

 

同样的元素样式后面覆盖前面样式

重复的属性才会根据优先级覆盖属性 不重复的元素会全部得到

 

以上只是基本选择器的优先级 当加入层级选择器后 只要是选中的相同dom，也遵循内联》id》class》element