CSS z-index プロパティ

❮ 前章へ 完全な CSS リファレンス 次へ ❯

画像に z-index を設定します:

img {
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: -1;
}
Try it Yourself ❯

定義と用法

z-index プロパティは、要素の重なる順序を指定します。

スタック順序の値が大きい要素は、スタック順序の値が小さい要素の前面に表示されます。

注: z-indexは、配置指定の要素(position:absolute、position:relative、position:fixed)でのみ動作します。

デフォルト値: auto
継承: 継承する
アニメーション可否: 可。animatable を参照 Try it
バージョン: CSS2
JavaScript 構文: object.style.zIndex="-1" Try it

ブラウザ・サポート

表中の数字は、完全にプロパティをサポートした最初のブラウザのバージョンです。

プロパティ
z-index 1.0 4.0 3.0 1.0 4.0

CSS 構文

z-index: auto|number|initial|inherit;

プロパティの値

説明 Play it
auto 親と同じスタック順序を設定します。これがデフォルトです Play it ❯
number 要素のスタック順序を設定します。負の値が使用できます Play it ❯
initial プロパティにデフォルト値を設定します。initial を参照 Play it ❯
inherit このプロパティは親要素を継承します。inherit を参照

関連ページ

CSS チュートリアル: CSS Positioning

HTML DOM リファレンス: zIndex property


❮ 前章へ 完全な CSS リファレンス 次へ ❯