pagetop

[CSS] 画像などをCSSでページの中央にする方法。

このエントリをはてなブックマークに追加このエントリをdel.icio.usに追加このエントリをLivedoor Clipに追加このエントリをYahoo!ブックマークに追加このエントリをFC2ブックマークに追加このエントリをNifty Clipに追加このエントリをPOOKMARK. Airlinesに追加このエントリをBuzzurl(バザール)に追加このエントリをChoixに追加このエントリをnewsingに追加このエントリをTwitterに追加

以前、Table-cellでボックス内の物を上下中央しましたが、
CSSで簡単に上下中央にする

画像などサイズが決まっている場合(500×275など)はこちらを使った方が簡単です。

Sample View

HTML

画像

CSS
.jyouge_tyuou {
	height: 375px;
	width: 500px;
	left: 50%;
	top: 50%;
	margin-top: -187px;
	margin-left: -250px;
	position: absolute;
}

position: absolute;を使って、top:50%とleft:50%を指定して画像の半分をずらします。
画像の半分だけをずらすために、Marginを使います。
因みに、画像が500pxだったら margin: -250px と(-半分のサイズ)にします。
それと、必ずサイズを入力してください。

Post a Comment

Eメールは必ず 入力してください。. *このマークが付いている物は必須項目です。

*
*

clear
clear

a