【background】背景関連をまとめて指定

backgroundプロパティでは、背景に関するプロパティをまとめて一括で指定することができます。 必要な値を任意の順番で指定し、それぞれを半角スペースで区切って設定します。

指定しなかった値については、そのプロパティの初期値が適用されます。 なおbackground-attachmentbackground-positionについてはNetscape4.7以前のバージョンには対応していないので注意して下さい。

また各プロパティの初期値や説明については、各ページを参照して下さい。(ページ下部より各プロパティのページへ移動できます)

書式

  • background : ★ ■ ♥ ▲ ♦ ……… 背景のプロパティをまとめて(一括で)指定

★:background-color
■:background-image
♥:background-repeat
▲:background-attachment
♦:background-position

background-color
背景色の指定
background-image
背景画像の指定
background-repeat
背景画像の繰り返しの指定
background-attachment
背景画像の固定・移動の指定
background-position
背景画像の位置の指定

使用した時の例

.sample1 {background: #D2CAEC url("sample.jpg") no-repeat right bottom;}
<div class="sample1">
背景色、画像、繰り返し、画像の位置(right,bottom)、background-attachmentは省略
</div>

ブラウザ上の表示例

背景色、画像、繰り返し、画像の位置(right,bottom)、background-attachmentは省略

対応ブラウザなどのデータ

初期値 個々のプロパティを参照 値の継承 継承しない
適用可能な要素 すべての要素
メディア visual
対応ブラウザ (image,colorの場合)Internet Explorer3~ , Google Chrome1~ , Firefox1~ , Opera3.5~ , Safari1~
(repeat,attachment,positionの場合)Internet Explorer4~ , Google Chrome1~ , Firefox1~ , Opera3.5~ , Safari1~

関連情報