背景

背景色や背景画像を設定する属性


▼背景の色を指定(background-color)

・背景の色を指定する属性 (transparent/すべて/しない)
・文字や段落ごとに背景色を変えることも可能です

「background-color:@@;」
#RGB、rgb()、キーワード、いずれの指定でも可
transparent 透明色 (NNは未対応)

ex:
背景を青色にしています
<span style="background-color:#0000ff;">背景を青色にしています</span>


▼背景画像を指定(background-image)

・ 背景画像を指定する属性(none/すべて/しない)
・「url()」のカッコの中に背景画像のURLを指定します
・外部ファイル(.css)に記述する場合はそのファイルからのURLで指定します
・文字や段落ごとに背景画像を変えることも可能です

「background-image:url(@@);」
( )内に画像のURL(相対パス)を指定

ex:
htmlではこれはできませんね
<span style="background-image:url(../../materials/bg/bg005.jpg);">htmlではこれはできませんね</span>


▼背景を固定する(background-attachment)

・スクロールによって背景画像を移動させるか固定させるかを設定する属性 (scroll/すべて/しない)
・IEのみで有効な属性です

「background-attachment:@@;」
fixed 画面をスクロールさせても背景は移動しない
scroll 画面をスクロールさせると同時に背景も移動する(初期値)


▼画像の貼りこむ方法の調整(background-repeat)

・背景画像の貼りこむ方法を調整する属性 (repeat/すべて/しない)
・背景は普通画面いっぱいに繰り返して敷き詰められますが、それを調整することができます

「background-repeat:@@;」
repeat 画面いっぱいに繰り返して敷き詰める(初期値)
repeat-x 横方向だけに画像を敷き詰める
repeat-y 縦方向だけに画像を敷き詰める
no-repeat 繰り返さずに一枚だけ配置