在CSS中，权重的概念用于确定当多个样式规则应用到同一个元素时，哪个规则会生效。权重越高，该规则对元素的最终样式影响越大。以下是CSS权重的详细说明和计算方式：
权重等级
!important：权重为10000，用于强制覆盖其他所有权重较低的样式规则。
内联样式：权重为1000，直接在HTML元素的`style`属性中定义的样式。
ID选择器：权重为100，通过元素ID定义的样式。
类选择器、伪类和属性选择器：权重为10。
标签选择器和伪元素选择器：权重为1。
通配符选择器：权重为0。
权重计算
当多个样式规则应用到同一个元素时，浏览器会根据上述权重等级进行计算。
如果某个选择器的权重值更高，则该选择器的样式规则会生效。
如果多个选择器的权重值相同，则后定义的规则会覆盖先定义的规则（即“后进先出”原则）。
示例
假设有以下CSS规则：
```css
header {
color: red；
}
.content {
color: blue；
}
header .content {
color: green；
}
```
在这个例子中：
`header`的权重为100。
`.content`的权重为10。
`header .content`的权重为100（ID选择器）+ 10（类选择器）= 110。
根据权重计算规则，`header .content`的权重最高，因此`color: green；`会覆盖`color: red；`和`color: blue；`，最终元素的颜色为绿色。
建议
使用!important时要谨慎，因为它会破坏样式的优先级规则，导致样式难以维护。
尽量通过合理的CSS结构和选择器设计来避免权重冲突，而不是过度依赖!important。
理解权重的计算方式有助于编写更加高效和可维护的CSS代码。
通过以上信息，你可以更好地理解和应用CSS权重，从而更有效地控制网页的样式表现。