CSS z-index | CSS プロパティ値| 意味使い方実例

CSS z-index| CSS:スタイルシート関数要素使い方・書き方例 CSS サンプル

2018-07-03 css-reference

ページコンテンツ

`z-index` CSS プロパティとは

トピック：配置された要素、つまり絶対値、固定値、または相対値のいずれかの位置値を持つ要素のレイヤーまたはスタックの順序を指定することができる積み重ね順序は、スクリーンに垂直なZ軸に沿った要素の位置を指す

基本書式：

セレクタ

{

z-index

値;

}

 img {
     position: absolute;
     left: 0px;
     top: 0px;
     z-index: -1;
}

デフォルト値・初期値 :	`auto`
適用対象 :	配置された要素
継承 :	不可
メディア :	visual
計算値 :	指定値
`CSS Version`	`CSS2 ～`
アニメーションの種類 :	integer
JavaScript 構文	object.style.zIndex="funWebref"
正規順序 :	形式文法で定義される一意のあいまいでない順序
Creates stacking context :	継承する
CSSの構文	`z-index: auto \| number \| initial \| inherit;`

値	説明
`auto`	スタックオーダーをその親に等しく設定するこれはデフォルトです
`number`	要素のスタック順序を設定する負の数は許可されます
`initial`	このプロパティをデフォルト値に設定する
`inherit`	親要素からこのプロパティを継承する

サポートするデスクトップブラウザ対応・互換性

Property	Desktop 互換性
z-index	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari
基本サポート	フルサポート◯1	フルサポート◯12	フルサポート◯1	フルサポート◯4	フルサポート◯4	フルサポート◯1
Negative values	フルサポート◯1	フルサポート◯12	フルサポート◯3	フルサポート◯4	フルサポート◯4	フルサポート◯1

：z-index 関連記事