1-3　スタイルシートによる背景指定の基本

以下、素材屋からダウンロードした壁紙を固定したりする上で、知っておくと便利な情報を書いております。（今すぐ記述方法を見たいという方は、こちらの 『壁紙の固定方法』 をご覧下さい。

<style type="text/css">
<!--
body {
background-color :#ffffff ; --- (1)
background-image : url(★) ; --- (2)
background-repeat :no-repeat ; --- (3)
background-position : ▲% ●% ; --- (4)
background-attachment : fixed ; --- (5)
}
-->
</style>

  1. 背景色を指定出来ます。
    見本では白（#ffffff）にしております。
  2. ★は画像のアドレスを記入致します。
    url(abc.gif);　url(cde.jpg);　等です。
    フォルダに画像を収納しておられる方は
    url(img/lmn.gif);　等、必要に応じてパスを変えて下さい。
  3. 画像を繰り返して表示するか否かを決めれます。
    no-repeat　でリピートをしない。
    repeat-x　　で横並び
    repeat-y　　で縦並びになります。
  4. ▲、●は画像の位置を指定出来ます。
    ▲は左からの位置を表し、0%だと左に配置され、数字が上がる事に右寄りになります。
    ●は上からの位置を表し、0%だと上に配置され、数字が上がる事に下寄りになります。
    (ちなみに「100% 100%」　で一番右下にレイアウトされます）。
  5. 位置は　fixed（固定する）、center（真ん中）、top（上）、
    bottom（下）、left（左）　right（右）やパーセンテージで細かく指定出来ます。

pagetop