<div class="scoping-root">
  <a href="#">スコープにマッチする要素</a>
  <div class="scoping-limit">
    <a href="#">スコープにマッチしない要素</a>
  </div>
  <a href="#">スコープにマッチする要素</a>
</div>
@scope (.scoping-root) to (.scoping-limit) {
  //class名「scoping-roo」の子孫要素かつ、class名「scoping-limit」の子孫要素でないa要素が対象
  a {
    color:red;
  }
}
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.