12周年記念パーティ開催! 2024/5/10(金) 19:00

z-index再入門

全3回

z-indexは要素の重なりを指定するプロパティですが、その仕組みを正確に押さえておかないと、思い通りの重なり順になりません。z-indexの仕様や仕組みを解説し、その使用例も取り上げます。

最終回 z-indexの困った使用例

z-index再入門の最終回では、実際の業務で出くわす可能性のある困ったz-indexの実装が引き起こす問題を紹介し、実際の実装のヒントとして、その解決法をいくつか提案します。

第2回 意図した順序に要素を重ねる

z-indexプロパティ、positionプロパティ、スタック文脈とスタックレベルを用いて、意図しない重なりが起こる原因を解説します。またスタック文脈を生成するz-index以外のプロパティにも触れます。

第1回 z-indexの仕組み

z-indexは要素の重なりを指定するプロパティですが、その仕組みを正確に押さえておかないと、思い通りの重なり順になりません。まずはz-indexの仕様も含め、z-index使用に必須項目を解説します。