CSS - @scope

program

https://www.tohoho-web.com/css/rule/scope.htm
@scopeは特定のセレクタ内にのみ効くスタイルを定義するためのアットルール。
2025年5月現在、firefoxではまだ使えない。

@scope (scope-start) {
  ...
}

@scope (scope-start) to (scope-limit) {
  ...
}

<element>
  <style>
  @scope {
    ...
  }
  <style>
</element>

2番目の形式は、scope-start セレクタにマッチする要素をスコープルートとするが、scope-limit セレクタにマッチする要素配下はスコープ外となる。
これを ドーナツスコープ と呼ぶ。