段落の背景に指定した画像を繰返し表示する
段落の背景に指定した画像は、繰返し表示(タイリング)させることができます。サンプルの画像はこちらですが、これを上下方向に繰返し表示させてみます。
|
パリ、1870年代。オペラ座では"ファントム"(オペラ座の怪人)のしわざとされる謎の事件が続いていた。 |
ソースは、下記のようになります。赤字部分で背景画像の繰返しを指定しています。
<p style="background-image:url(./sample/cat.gif);background-repeat:repeat-y">
パリ、1870年代。オペラ座では"ファントム"(オペラ座の怪人)のしわざとされる謎の事件が続いていた。<br>リハーサル中での事故で、プリマドンナの代役を務めることになったクリスティーヌは、その初主演のステージで喝采を浴び、観客の中にいた幼馴染のラウルと再開する。<br>だが、その喜びも束の間、仮面をかぶった謎の怪人、ファントムに...
</p>
繰返し方法の指定は、下記のキーワードから選べます。
| repeat | 上下左右にパターンを繰り返す (通常の繰返し) |
| repeat-x | 左右にパターンを繰り返す |
| repeat-y | 上下にパターンを繰り返す |
| no-repeat | 繰り返さない |
