CSS isolation 属性

定義と使用法

isolation 属性は、要素が新しいスタッキングコンテキストを作成する必要があるかどうかを定義します。

ヒント：background-blend-mode または mix-blend-modeと一緒に使用すると、isolation 属性が非常に有用です。

参照してください：

HTML DOM リファレンスマニュアル：isolation 属性

例

id="e"の要素に新しいスタッキングコンテキストを作成します：

#e {
  isolation: isolate;
}

自分で試してみる

CSS 文法

isolation: auto|isolate|initial|inherit;

属性値

値 説明
auto デフォルト。要素に適用される属性のいずれかがそれが必要な場合にのみ、新しいスタッキングコンテキストを作成します。
isolate 新しいスタッキングコンテキストを作成する必要があります。
initial この属性をデフォルト値に設定します。参照してください。 initial。
inherit この属性は、親要素からこの属性を継承します。参照してください。 inherit。

技術的詳細

デフォルト値： auto
継承： いいえ
アニメーション作成： サポートしていません。参照してください：アニメーション関連属性。
バージョン： CSS3
JavaScript 文法： object.style.isolation="isolate"

ブラウザのサポート

このテーブルの数字には、この属性を完全にサポートする最初のブラウザのバージョンが記載されています。

Chrome IE / Edge Firefox Safari Opera
41.0 79.0 36.0 はい 30.0