ホームページ楽々講座192

【スクロールしても同じ位置に画像を表示する】

 以前、スクロールしても直ぐに画像を指定した位置に戻す方法を書きまし
たが、これはちょっと時間的ずれが生じるので見栄えが悪かったですね。

 今日の方法は、スクロールしても同じ位置に表示する画像を背景画像とし
て用います。これならスクロールさせても画像はびくともしません。

 背景画像と一緒に背景色を用いることも可能です。BODY{background:azure 
でも <BODY BGCOLOR="azure"> でもOKです。

●画像の表示位置

 横方向:left(左)、center(中央)、right(右)
 縦方向:top(上)、center(中央)、bottom(下)

<HTML>
<HEAD>
<TITLE>192</TITLE>
<STYLE>
BODY{background:white url(../banner.gif) no-repeat fixed right bottom;}
</HEAD>
<BODY>
<DIV STYLE="font-size:28pt;color:red;text-align:center;">
ホームページ楽々講座192</DIV><P>
<DIV STYLE="font-size:11pt;color:navy;">
<PRE>
●画像の表示位置

 横方向:left(左)、center(中央)、right(右)
 縦方向:top(上)、center(中央)、bottom(下)
</PRE>
</DIV>
</BODY>
</HTML>