• 文字色　color  :  ★ ;　　（★はＲＧＢ値かカラーネームで）
• 背景色　background-color  :  ★ ;　　（★はＲＧＢ値かカラーネームで）

• background-image : url("★");　　　（★は画像のURLを記入）
  

• background-repeat : ★;　　　（★はキーワード指定）
  
• キーワード
  repeat　　　　　　　　（画面いっぱい敷き詰め・既定）
  repeat-x　　　　　　（横方向にのみ繰り返し）
  repeat-y　　　　　　（縦方向にのみ繰り返し）
  no-repeat　　　　　（繰り返ししないで１点表示）

• background-attachment : ★;　　　（★はキーワード）
• キーワード
  fixed　　　　　　　　（背景を固定）
  scroll　　　　　　　 （スクロールに応じて移動・既定）

• background-position : ★;
• background-position : ★　★;　　　　（★はキーワード、数値＋単位、％）
• キーワード
  top　　　　　　　　（上端）
  center　　　　　 （中央）
  bottom　　　　　 （下端）
  left　　　　　　　 （左端）
  right　　　　　　 （右端）
  数値＋単位の指定は、下の書式を使用します。
  最初の数値が左端からの距離、二番目の数値が上端からの距離を入れます。
  （ background-position : 30px 40px;　という風に指定します）
  ％指定に関しても同様にします。
  数値を片方しか指定しない場合は、自動的に５０％で設定されます。

• background-position-x : ★;　　（水平方向・★はキーワード指定）
• background-position-y : ★;　　（垂直方向・★はキーワード指定）
• キーワード
  top　　　　　　　　（上端）
  center　　　　　 （中央）
  bottom　　　　　 （下端）
  left　　　　　　　 （左端）
  right　　　　　　 （右端）

• <STYLE type="text/css">
  <!--
  body {
  background : url("sample.gif") fixed repeat-y;
  }
  -->
  </STYLE>
  上記ではsample.gifという背景画像を垂直方向へ繰り返し、画像は固定するという指定をいます。
  これにより背景画像はスクロールの場合にも文字などはスクロールするのに対して動かずに固定されたままになります。

ページトップへ