【背景に画像を使用する方法】
まず、『背景のスタイル設定』の項目にある文字列(background-color:#000000;)を消去。
その後、(background-image:url(画像URL);)を書き込んでください(コピー&ペースト可&カッコ不要)。
画像URLの部分は必ず変更してください。
①背景の固定する
上記の設定で背景を画像にした場合には、画像が左上(?)から順に繰り返しで表示されます。
それを改善したい場合は、上記の部分の下に(background-attachment:fixed;)を追加してください(カッコは不要)。
尚、段落を下げた場合には自動で(<br>)が挿入されますので、段落を作らないようにしてください。
※(fixed)を(scroll)に変更することで、背景画像をスクロール出来るようになります。
②背景の貼り方を指定する
(background-repeat:)の語尾に記号を加えることで、背景画像の貼り方(並び方)を変更可能です。
| repeat; |
全体に繰り返す |
| repeat-x; |
横方向のみに繰り返す |
| repeat-y; |
縦方向のみ繰り返す |
| no-repeat; |
一つだけ表示する |
尚、どうしても指定したい場合に使用するのみで、通常は必要ありません。
設定には『①背景の固定する』同様に(<br>)を入れないようにしてください。
③背景画像の位置を指定する
(background-position:)の語尾に記号を加えることで、背景画像の位置を指定します。
| left; |
左 |
| center; |
真ん中 |
| right; |
右 |
| top; |
上 |
| bottom; |
下 |
これも、『②背景の貼り方を指定する』同様に、必要な場合にのみ使用してください。
設定には、『①背景の固定をする』と『②背景の貼り方を指定する』と同様に(<br>)は必要ありません。入った場合には、必ず消去してください。
尚、上で紹介したキーワードは組み合わせが可能で、(background-position:right bottom;)と記述すれば、画像は右下に表示されます。
最終更新:2010年10月14日 20:40