background-position

このエントリーをはてなブックマークに追加

background-positionプロパティは背景画像の初期表示位置を指定できるプロパティです。

値には left 、center 、 right 、 top 、 bottom と言ったキーワードや %、値で指定することができ、横方向位置、縦方向位置の順番で指定します。

.target{
	background-position:left center;
}

この指定は以下の指定と同じ意味を持ちます。

.target{
	background-position:0% 50%;
}

%や値による指定は左上を起点に距離を算出しますが、CSS3から以下のように値の前に起点の位置を指定できるようになりました。

.target{
	background-position: bottom 10px right 20px;
}

参考URL

3.6. Positioning Images: the ‘background-position’ property - W3C

登録日 : 2014年01月08日 最終更新日 : 2014年1月8日

同じカテゴリー(Background)のエントリー

検索

スポンサードリンク

バージョン

リファレンス