CSS样式的优先级基于几个主要因素：
- 直接样式：直接在元素上的样式（内联样式）。
- ID选择器：每个ID只能使用一次，高优先级。
- 类、属性和伪类选择器：按照选择器的数量和质量。
- 元素和伪元素选择器：按数量。
- 通配选择器（
*）：最低优先级。
优先级规则：内联样式 > ID选择器 > 类/属性/伪类选择器 > 元素/伪元素选择器 > 通配选择器
提升优先级的方法：
- 提升特指度：使用更具体的选择器。
!important：在声明的末尾添加，会覆盖所有其他同权重的规则，但不推荐使用，因为它破坏了样式表的管理性。
样式层叠：当多个样式规则应用于同一元素且优先级相同时，会发生样式层叠。
- 文字和背景的层叠遵循"正常流"和"文字流"的规则。
- 对于其他属性，如果存在冲突，则遵循"后来者优先"的原则。
使用数值计算优先级：
- 将所有应用到元素的选择器的权重值相加。
- 按照选择器的复杂度进行计算：
ID > 类 > 标签。 - 如果权重值相同，则遵循层叠规则。
示例代码：
/* 直接样式 */
#myId { color: red; } /* 权重：100 */
/* 类和属性选择器 */
div[data-custom="value"] .myClass { color: blue; } /* 权重：10 + 1 = 11 */
/* 元素和伪元素选择器 */
p:before { color: green; } /* 权重：1 */
/* 通配选择器 */
* { color: black; } /* 权重：0 */在这个例子中，即使div[data-custom="value"] .myClass的选择器更具体，也无法超过#myId的ID选择器。然而，如果#myId被移除或者没有应用到该元素上，div[data-custom="value"] .myClass将会因为更多的类和属性选择器而获得应用。
如果需要提升优先级，可以使用更多的ID选择器或者将类和属性选择器组合使用，例如：
#myId .myClass[data-custom="value"] { color: purple; } /* 权重：100 + 1 = 101 */这样就提升了优先级，即使其他规则中包含了元素或伪元素选择器。