無料ホームページ作成！ＣＳＳ・スタイルシート
z-index

無料ホームページ作成！CSS・配置
z-index属性

ホームページの要素の重なる順番の指定

要素の重なる順番

z-index属性は要素の重なる順番を指定する属性です、position属性やtop,right,bottom,left属性などで重なった要素の重ねる順番を指定できますので、わざと重ねておしゃれなホームページを作成することもできます。

top,right,bottom,left属性の使い方

CSSソース

セレクタ{
	z-index:1;
	position:relative;
	left:100px;
}

セレクタ{
	z-index:2;
	position:relative;
	left:100px;
	bottom:70px;
}
 

結果

z-index属性で宣言できる値

値	概要
数値	重なる順番を数字で指定 （数が大きいと上に表示される）

値の使用例

z-index属性で要素を重ねる事により、複雑なデザインをしなくても簡単に少し変わったホームページを作成できます。