CSS继承自特定元素

Question

在CSS中是否可以使用inherit属性从特定元素继承？

例如，有CSS语法可以让这个<p>从container1而不是container2继承吗？假设没有找到相当长的搜索原因，但我希望你能证明我错了。

.container1{
 color: blue
}

.container2{
 color: green
}

.p {
 color: inherit;
}

<div class="container1">
 <div class="container2">
  <p>
    foo
  </p>
 </div>
</div>

Answer 1

要防止元素从其父元素继承，您可以使用 :not() 伪类将其明确地从其父级CSS中排除：

例如：

.container2 :not(p) {
  color: green;
}

<强>段：

.container1 {
  color: blue;
}

.container2 :not(p) {
  color: green;
}

<div class="container1">
  <div class="container2">
    <p>
      Feeling rather blue today.
    </p>
    <span>
      It's not easy being green.
    </span>
  </div>
</div>