背景画像の位置を指定して表示

背景画像を指定した位置に表示したい場合があります。

例えば左の画像の基本単位（画像ファイル）はこれです-->　　

この画像を背景画像として希望の位置（上端・中央・下端・右端・左端）に表示するためには『スタイルシート』を用いて、次のように記述する必要があります。

以下の部分を<head>～</head>の中に記述して下さい。

『設定したい位置』という部分には次のように指定します。
以下の各表記法にリンクされたページは、繰り返し指定の方法を『no-repeat』で指定したものです。
リンクを辿って確認してみて下さい（但し、元々の背景画像（薄い青紫の背景）は外してあります。ここで貼り付けを試みた画像（ピンク色の画像）の位置がしっかりと確認できるようにするためです）。

表記法	説　　　　　　明
top	上端に表示
center	中央に表示
bottom	下端に表示
right	右端に表示
left	左端に表示

『繰り返しの方法を指定』という部分には次のように指定します。

表記法	説　　　　　　明
repeat	画面いっぱいに繰り返して表示（省略した場合にはこれが指定される）
repeat-x	横方向に繰り返して表示
repeat-y	縦方向に繰り返して表示
no-repeat	繰り返さず一点だけ表示

縦長や横長の画像を一つだけ、指定の位置に表示させたい場合には、設定したい位置に上の表（top・center・bottom・right・leftの中）から選択し、尚かつ、繰り返しの方法の部分に『no-repeat』を記述します。

FAQのページへ