CSSのz-index、visibility、opacityプロパティ指定方式


z-index

z-index プロパティは要素の重なり順序を指定します。数値が大きいほど前面に表示されます。デフォルトのautoは、特に指定がない場合、要素は親要素の順番に従います。

z-index 1
z-index 2
z-index 3

visibility

visibility プロパティは要素の表示・非表示を指定します。デフォルト値はvisibleです。hidden を指定すると、要素は非表示になりますが、レイアウトには影響を与えません。

Visible
Hidden
Visible

opacity

opacity プロパティは要素の不透明度を指定します。0から1の値を取り、0は完全に透明、1はデフォルト値で完全に不透明を意味します。

Opacity 1
Opacity 0.5
Opacity 0