CSS inheriting from a specific element

Question

In CSS is it possible to use the inherit property to inherit from a specific element?

For example is there CSS syntax which could let this <p> inherit from container1 instead of container2? Assuming there isn't cause searched for quite a while to find this but I hope you can prove me wrong.

.container1{
 color: blue
}

.container2{
 color: green
}

.p {
 color: inherit;
}

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

Answer 1

To prevent an element from inheriting from its parent, you could explicitly exclude it from its parent's CSS using the :not() pseudo-class:

For example:

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

Snippet:

.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>