Css层叠优先级只会这两招还远远不够

CSS层叠优先级通常由四个级别组成：

1. 内联样式（Inline style）：style属性直接在元素上定义的样式。
2. ID 选择器（ID selectors）：以 # 开头的选择器，例如 #id。
3. 类选择器（Class selectors）和属性选择器（Attribute selectors）：以 . 或其他属性开头的选择器，例如 .class 或 [attribute]。
4. 元素选择器（Element selectors）和伪类（Pseudo-classes）：标签名称或伪类如 :hover。

还有一个重要级别是通配选择器（Universal selectors），即 *，但它的优先级最低。

在实际应用中，可以通过提升选择器的特异性来增加其优先级：

• 增加ID选择器的数量。
• 增加类选择器、属性选择器和伪类的数量。
• 增加元素选择器和伪类的数量。

例如：

#myId .myClass > p:first-child {
  color: blue; /* 高优先级 */
}
 
.otherClass {
  color: red; /* 低优先级 */
}

在这个例子中，第一个规则有更高的优先级，因为它有一个ID选择器和其他几个类选择器，而第二个规则只有一个类选择器。

如果需要提高优先级，可以结合选择器，例如：

#myId .myClass .myOtherClass p {
  color: blue; /* 优先级提升 */
}

这里通过增加一个类选择器来提升优先级。