[分享]CSS中4个选择器的不同优先级

CSS中有四个选择器，分别是id选择器、类选择器、标签选择器、通配选择器。在应用多个选择器时，每个选择器都有其独特的优先级和权重，下面就针对这四个选择器进行比较。1、id选择器（）id { color...

CSS中有四个选择器，分别是id选择器、类选择器、标签选择器、通配选择器。在应用多个选择器时，每个选择器都有其独特的优先级和权重，下面就针对这四个选择器进行比较。

1、id选择器（#）

#id {
    color: red;
} 

id选择器的优先级是最高的，因为id选择器是唯一的且在整个页面中只能出现一次。

2、类选择器（.）

.class {
    font-size: 20px;
} 

类选择器的优先级次于id选择器，因为它可以被多次使用，且在同一个元素中可以出现多个类选择器。

3、标签选择器

p {
    font-weight: bold;
} 

标签选择器的优先级仅次于类选择器，因为标签选择器可以被多次使用，但它不能单独出现，同时会受到通配选择器的影响。

4、通配选择器（*）

* {
    margin: 0;
    padding: 0;
} 

通配选择器的优先级最低，因为它会影响所有元素。当与其它选择器一起使用时，其优先级最低。

综上所述，选择器的优先级顺序为：id选择器 > 类选择器 > 标签选择器 > 通配选择器。在实际应用时，我们可以通过选择器的优先级来确定应用哪一个样式。