【CSS】z-indexとは? ~要素の高さの順序を設定する方法~ | MUKKUN QUEST
MUKKUN QUEST     

【CSS】z-indexとは? ~要素の高さの順序を設定する方法~

HTML&CSS

【CSS】z-indexの解説です。読み方は「ゼット,インデックス」
要素の重なりがある場合に、高さを指定する方法を知りたい方はこちらで解決します💡

スポンサードサーチ

【CSS】z-indexとは? ~要素の高さの順序を指定する方法~

具体的に解説していきます。

【実例】z-indexはこう打てば、こうなる


☝このように打つことで、指定した要素に高さを与えることができますので、要素が重なる際の表示順に優劣をつけることができます。

【使い方】z-indexは実際にこう使う

「position」というCSSで要素に重なりを指定した時に、上に表示したいほうの要素に、このCSSをあてます。他の要素に何かを入力する必要はありません。

【特徴】z-indexの特徴

●z-indexは「position」というCSSで要素に重なりを指定した時にしか使用できないので注意。
●z-indexで指定をしていない要素の基準値は「0」です。
●数値は、整数であれば良いので、マイナス(-)を指定することも可能です。

【注意】z-indexを使う時に起こりやすいミスの事例

●指定する数値は整数である必要があるので、単位つけたり、小数点をつけないよう注意が必要です。

z-indexに似た効果を持つCSS

※情報は随時更新します。