css权重 优先级

1、优先级等级:

从高到低，依次为:

• 内联样式(直接在HTML元素上的style属性)。
• ID选择器(如#id)。
• 类选择器、属性选择器和伪类选择器(如.class、[attr=value]、 :hover)。元素选择器和伪元素选择器(如div、::before)
• 通配符选择器(如*)、后代选择器(如divp)、子选择器(如div>p)等组合选择器。

2、优先级计算:

按照以下方式计算选择器的权重:

• 每个内联样式加1000分。
• 每个ID选择器加100分。
• 每个类选择器、属性选择器和伪类选择器加10分。
• 每个元素选择器和伪元素选择器加1分。

3、比较优先级:

根据上述计算结果进行比较，分数高的优先级高。若优先级相同，则后定义的样式优先。

选择器

CSS选择器是用来选择HTML元素，以应如何用CSS样式。主要包括下面几种类型:

• 基础选择器:类型选择器、类选择器、ID选择器、通配符选择器
• 层次选择器:后代选择器、子选择器、相邻兄弟选择器、通用兄弟选择器
• 属性选择器:如[attr=value]
• 伪类选择器:如:hover、:nth-child()
• 伪元素选择器:如::before、::after