背景画像を固定する

画像を固定するには背景画像のURL、固定するかしないか？、どうやって表示するか？、どこに表示するかの4つの情報を入力する必要があります。

<style type="text/css">
<!--
body {background-image: url("");background-repeat: #; background-attachment: #; background-position: # *;}
-->
</style>

サンプルを表示する。

background-image: url("")
""内には画像URLを入れます。

background-repeat: #;
#の値には
no-repeat
(1つだけ画像を表示してスクロールしても固定できるようにする)
repeat-x
(横方向のみ画像表示する)
repeat-y
(縦方向のみ画像表示する)
repeat
(規定値です縦、横ともにタイル上に画像が表示されます)

background-attachment: #;
#の値には
fixed
(画像を固定する)
scroll
(画像をスクロールしても固定されないようにする)
scrollは通常設定なので改めて設定する必要はありません。

background-position: # *;
#の値には
横方向の設定として…
center
(中央に表示)
left
(左に表示)
right
(右に表示)
数値で指定
左からどのくらい動くかを数字で表します。
50%だと中央へ、20%だと左より、70%だと右よりと言うことです。

*の値には
縦方向の設定として…
top
(上に表示)
bottom
(下に表示)
center
(中央に表示)
数値で指定
上からどのくらい動くかを数字で表します。
50%だと中央へ、20%だと上より、70%だと下よりと言うことです。

[MENUに戻る]
[HOME]