初心者のためのWEBデザイナーの教科書

要素の重なり優先順を指定

z-index:値

値は整数で入力し、大きい数値のものほど手前に表示される。(ゼロ開始やマイナス値も有効)
※(注意)要素は、ポジションプロパティで指定し、基本的にはabsoluteであることが前提である。
︎ ポジションプロパティとは



A


/*後ろの赤いボックス*/
#item01{
width:180px;height:180px;
background-color:red;
position:absolute;top:100px;left:150px;
z-index:0;}
/*手前の青いボックス*/
#item02{width:200px;height:200px;
background-color:blue;
position:absolute;left:190px;top:30px;
z-index:1;}

【逆転バージョンも試してみましょう】

A