背景画像を縦または横に繰り返して表示



比較的小さな画像ファイルを一つだけ表示したい場合があります。
これまで説明してきたページでは一つの画像を繰り返して表示していましたが、このページでは、敢えて一つだけ表示するようにしています。

例えばここで使っている画像の基本単位（画像ファイル）はこれです-->　　

標準設定では、背景画像を貼り付けると繰り返し表示してしまいます。

これを実現するためには『スタイルシート』を用いて、次のように記述する（つまり、『no-repeat』と記述する）必要があります。

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

<style type="text/css">
<!--
body {background-image:url('表示させたい画像ファイルのファイル名');
        background-repeat:繰り返しの方法を指定;}
-->
</style>


『繰り返しの方法を指定』という部分には次のように（つまり、『no-repeat』）指定します。


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


リンク元はここですが、別ページで開いているので閉じて下さい。