戻る

background-positionプロパティとは

background-positionプロパティは、背景画像の表示位置を設定するプロパティです。初期値は「0% 0%」となっています。ブロックレベル要素と置換要素にだけ適用できます。

背景画像が並べて配置される場合(background-repeat:repeat)には、このプロパティで指定した位置を基準として繰り返し表示されることになります。

数値:単位付きの実数

指定した要素パディング領域の左上から背景画像の左下までの距離を、単位付きの実数で指定して位置を示します。1つめの値に水平位置、2つめの値に垂直位置を、半角スペースで区切って指定しいます。 値が1つだけの場合、その位置は水平位置となり、垂直位置は「50%」が指定されることになります。値にはマイナス値を指定することもできます。

数値:%

指定s多要素のパディング領域の左上から背景画像の左下までの距離を、%で指定して位置を示します。 1つめの値に水平位置、2つめの値に垂直位置を、半角スペースで区切って指定します。値が1つだけの場合、その値は水平位置となり、垂直位置は「50%」が指定されたことになります。値にはマイナス値を指定することもできます。

キーワード:「top・center・bottom」、「left・center・right」

「top・center・bottom」は垂直方向、「left・center・right」は水平方向を指定できます。それぞれ「0%・50%・100%」と指定した時と同じ結果になります。 なおキーワードの場合は、1つめの値に垂直方向、2つめの値に水平方向という指定でも問題ありません。

inserted by FC2 system