「誰もz-indexについてあなたに言っていない」という記事で誰もz-indexについてあなたに言っていないという事実

画像

ほぼ2年前、記事「 誰もあなたにz-indexについて語ったこと 」(およびHabrでの翻訳「 誰もあなたにz-indexについて語ったこと 」)が出版され、その著者はあまり知られていない( これについては初めて )ですが、 opacity



が1未満であることを示す新しいオーバーレイコンテキストを作成する可能性が文書化されています



しかし、記事のタイトルにもかかわらず、著者はまだ何か他のことを言っていません。



スタッキングコンテキストの概念に精通していることを前提としています。
共通の親を持つ要素が前面または背面に移動する要素は、オーバーレイコンテキストと呼ばれますオーバーレイコンテキストを理解することは、 z-index



と要素の順序を理解するための鍵です。



オーバーレイコンテキストには、HTML構造内に独自のルート要素があります。 要素に新しいコンテキストを作成する瞬間に、すべての子要素もこのコンテキストに分類され、スタック順に配置されます。 要素が1つのオーバーレイコンテキストの一番下にある場合、 z-index



100万にz-index



ていても、想像できないほど想像もできない方法で、階層の上位にある隣接するオーバーレイコンテキストの別の要素の上に表示できます。
-記事「 z-indexについて誰も教えてくれなかったもの 」から。 このトピックを理解するには、彼女またはMDNの古典的な作品のいずれかに精通することを強くお勧めします。


新しいオーバーレイコンテキストは 、次の場合に形成されます。






All Articles