css八大选择器的优先级 |css数字时钟代码

为了处理这种情况，CSS定义了一个规则集在应用时的优先级。这个优先级是通过选择器的权重来衡量的，权重越高，应用的规则就越优先。

CSS中有八种选择器，它们的权重如下：

1. ID选择器（#yourid）权重为100
2. 类选择器、属性选择器和伪类（.yourclass、[type="radio"]、:hover）权重为10
3. 元素选择器和伪元素（div、::before）权重为1
4. 通用选择器和组合选择器（*、div p）无权重声明，只有选择器本身的优先级。

这些选择器在不同场景下会有不同的表现。大家来看一下一个例子：

#header{
background: orange;
}
.header{
background: green;
}
header{
background: blue;
}
<header class="header">Hello World!</header>

在这个例子中，有三个选择器，它们分别对header元素应用了不同的颜色。虽然.header和header选择器都可以匹配到这个元素，但是ID选择器的权重最高，所以会优先应用orange颜色。

同时，.header选择器和header选择器相同权重，但是类选择器的优先级比元素选择器高，所以会优先应用绿色颜色。

选择器的优先级不是简单的和权重相加，而是考虑了选择器的个数、位置等因素。比如说：

#header .header{
background: black;
}

这个选择器比单独的.header选择器的优先级要高，因为它包含了一个ID选择器。

总的来说，当大家使用CSS时，应该尽可能减少选择器的数量和选择器的嵌套层级，这样可以避免CSS的性能问题。对于权重冲突的问题，大家可以使用!important声明来强制应用某个规则。