WEB技術の辞書・解説・使用例

TOP > CSS >  CSS辞典 > background-position
background-position  背景 

背景画像の位置を指定する。

このエントリーをはてなブックマークに追加
背景画像の位置を指定します。また背景画像を指定する background-imageプロパティで背景画像を指定して下さい。

書式

background-position : 水平位置 垂直位置 ;
(例) background-position : 10px 5px ;
(例) background-position : right top ;

パラメーター

数値で指定　… ピクセルなどで指定。
キーワードで指定　… left(左) / center(中央) / right(右)

サンプルコード


<div style="height:50px;background: #f0f0f0 url(/img/na.gif) no-repeat;">指定なし</div>
指定なし

<div style="height:50px;background: #f0f0f0 url(/img/na.gif) no-repeat; background-position:left top;">left top で指定</div>
left top で指定

<div style="height:50px;background: #f0f0f0 url(/img/na.gif) no-repeat; background-position:center;">centerで指定</div>
centerで指定

<div style="height:50px;background: #f0f0f0 url(/img/na.gif) no-repeat; background-position:10px 20px;">10px 20pxで指定</div>
10px 20pxで指定