文章の背景に画像を固定表示する

文章の背景に画像を指定した際に、スクロールバーを操作しても背景画像が一緒にスクロールしない固定表示にすることができます。

<タグ名 style="background-attachment:固定方法">～</タグ名>
  1. タグ名：P、DIV および SPAN タグなどが一般的ですが、ほとんどのブロックタグおよびインラインタグが使用可能です。
  2. 固定方法：下記のキーワードで指定できます。
    キーワード文字のスタイル
    scroll 固定しない。ユーザーがスクロールバーで画面をスクロールすると、それにあわせて背景画面も移動する。
    fixed 固定する。スクロールバーを操作しても背景画像は常に同じ位置に表示される。

サンプルソースです。

<div style="background-image:url(sample/cat.gif);
background-repeat:repeat;background-attachment:fixed;
height:80px;overflow:scroll">
この段落は、背景画像を固定表示しています。
スクロールバーでクロースしてみてください。<br><br>
文章はスクロールしますが、背景画像は<br>
動きませんね。サンプル文章が短いので<br>
ちょこっとしかスクロールしませんが...
</div>
Code:
<div style="background-image:url(sample/cat.gif);
background-repeat:repeat;background-attachment:fixed;
height:80px;overflow:scroll">
この段落は、背景画像を固定表示しています。
スクロールバーでクロースしてみてください。<br><br>
文章はスクロールしますが、背景画像は<br>
動きませんね。サンプル文章が短いので<br>
ちょこっとしかスクロールしませんが...
</div>