简述CSS3选择器优先级及计算？

CSS的选择器优先级是一个相对复杂的概念，它规定了在一组样式冲突时，哪些样式将被浏览器采纳。选择器优先级是通过一个四位的值来计算的，形式为：[内联样式, ID选择器, 类选择器/属性选择器/伪类, 元素选择器/伪元素]。这四个等级的优先级从左到右递减，左边的优先级最高，右边的优先级最低。

1. 内联样式：直接在HTML元素中的”style”属性里定义的样式，优先级最高，记为1000。
2. ID选择器：通过元素的id选择元素，记为0100。
3. 类选择器、属性选择器、伪类：通过元素的class、属性或者伪类选择元素，记为0010。
4. 伪元素、元素选择器：通过元素名称或者伪元素选择元素，记为0001。

比如：

• h1 { color: red; } // 优先级为0001
• .class { color: blue; } // 优先级为0010
• #id { color: green; } // 优先级为0100
• < p style=”color: yellow;”> // 优先级为1000

如果一个选择器同时包含多个部分，那么优先级就是这些部分的和。比如：#id .class h1 { color: black; } 的优先级为0111 (0100 + 0010 + 0001)。

在实际应用中，如果我们想要覆盖掉某些已经定义好的样式，就需要利用这个优先级规则，通过增加选择器的优先级来实现。

需要注意的是，!important规则的优先级最高，它可以覆盖所有其他的样式，但是过度使用可能会导致代码难以维护，所以一般情况下我们应尽量避免使用。