ウェブランサー

background - 背景に関する指定をまとめて行う

対応ブラウザ
IE7対応IE8対応Firefox対応Chrome対応Opera対応Safari対応
適用対象 全ての要素
継承 しない

backgroundプロパティは、背景に関する指定を一括して行う事ができます。複数の指定をまとめて行いたいとき、個別指定を省略したいときに使用します。背景画像を配置する際には、画像が表示されなかった時の為に代用カラーを設定しておきましょう。

backgroundには、"background-color"、"background-image"、"background-repeat"、"background-attachment"、"background-position"の値を指定することができます。複数の値を指定する場合には、半角スペースを空けて記述してください。

backgroundに与えられる値

background: 値;
背景色、背景画像、背景画像繰り返し制御、背景画像スクロール制御、背景画像位置制御

backgroundの使用サンプル

CSS
.bg_sample {
 border-left: 5px solid #666666;
 background: url(images/sample_bg_stripe.png) repeat-x #99CCFF;
 padding: 5px;
}
XHTML
<div class="bg_sample">表示サンプル</div>
表示確認
表示サンプル

backgroundに関連するCSSプロパティ

背景(バックグラウンド)
background 背景に関する指定をまとめて行う
background-attachment 背景画像の固定・移動を指定する
background-break インライン要素の背景画像の繰り返し方法を指定する
background-clip 背景の描画範囲を指定する
background-color 背景色を指定する
background-image 背景画像を指定する
background-origin 背景の描画する際の基準となるボックスを指定する
background-position 背景画像の表示開始位置を指定する
background-repeat 背景画像の繰り返しを指定する
background-size 背景画像を表示するサイズ(大きさ)を指定する