问题不是子组合器(>)，它是color属性，它是可继承的。

虽然颜色属性的初始值因浏览器而异，但继承是常见的。这意味着元素的文本颜色从父代继承。您在代码中看到这一点。

相反，border属性是不可继承的。请注意，与文字颜色不同，它仅适用于您的目标li：

ul > li {

color: red;

border: 1px solid black;

}

li { border: 1px solid inherit !important; }

• This should be red
  1. default color 1
  2. default color 2
• And this should be red also
  1. default color 3
  2. default color 4

要实现样式设置目标，请为li元素设置默认颜色。这将覆盖继承。这里有一个例子：

ul > li {

color: red;

}

li {

color: black;

}

• This should be red
  1. default color 1
  2. default color 2
• And this should be red also
  1. default color 3
  2. default color 4

参考文献：