2006年12月28日

背景補足

前回書いた、background:ですが、
実は一行で書けるわけは・・・
background-attachment:
background-color:
background-image:
background-position:
background-repeat:
などの複数の設定を一度に設定できる為です。
それぞれの指定できる値などは、

background-attachment:背景画像の固定かスクロールの設定
fixed     背景画像固定
scroll    背景画像スクロール


background-color:背景色
#ffffff           色コード(RGB値)指定
colorname        色名での指定
transparent      透明、透過


background-image:背景画像の指定
none    なし
url( )    URLでの指定


background-position:背景画像表示位置
実数値+ 単位       水平方向 垂直方向の順に基点から左からの距離、上からの距離
パーセント値        表示位置の割合と画像の位置の割合がそろう
上記二つの基点は、領域のパディング内の左上が基点となります。
以下は、キーワード
left      左寄せ
right     右寄せ
top      上寄せ
bottom   下寄せ
center    中央に・・


background-repeat:背景画像繰り返しの指定
repeat        タイル状に縦横に
repeat-x       横方向反復
repeat-y       縦方向反復
no-repeat      繰り返しなし、単回表示



と言うぐあいです。
以上が組み合わさって、
background:#ff00ff url(/usr/honyara/sample.jpg) no-repeat top right fixed;
のように書ける訳ですね。
ただ、すでに書いてますが、領域の指定は、自動では画像に合うとは限らないので、
そのセレクタ中で別途指定しておいたほうが良いですね。


同じカテゴリー(ちょいtips)の記事
 空間を制するものは・・・ (2006-12-28 06:06)
 背景というか・・・ (2006-12-27 05:05)
 リンクアンカーのいじり方? (2006-12-26 22:37)
 このページの上へ▲の変更法 (2006-12-12 07:07)
 font属性などの優先順位? (2006-12-12 01:34)
 解析中にちょいといたずら? (2006-12-09 22:54)

00:01にslow liferさん記載 │こめんと☆ミ(0) ちょいtips
上の画像に書かれている文字を入力して下さい
 
<ご注意>
書き込まれた内容は公開され、ブログの持ち主だけが削除できます。