mozilla
Your Search Results

    background

    概要

    background プロパティは個々の背景関連プロパティの値を、スタイルシートの単一の場所で設定するショートハンド・プロパティです。次のプロパティの値から一つ以上を(複数の場合は半角スペース区切りで)同時に設定可能です。

    background-attachmentbackground-colorbackground-imagebackground-positionbackground-repeatbackground-sizebackground-attachment

    ショートハンド・プロパティ background は、明示的に値を指定されたもの以外は初期値に設定します。

    • 初期値 transparent || none || repeat || scroll || 0% 0%
    • 適用範囲 全要素
    • 継承 継承しない
    • 割合 background-position でのみ有効
    • メディア visual
    • 計算値 個々のプロパティのページを参照してください。

    構文

    background:  [<bg-layer>, ]* <final-bg-layer>

    詳細な内容は以下:

    <bg-layer>
    [ <background-image> || <background-position> [ / <background-size> ]? || <background-repeat> || <background-attachment> || <background-clip> ]
    inherit
    <final-bg-layer>
    [ <background-color> || <background-image> || <background-position> [ / <background-size> ]? || <background-repeat> || <background-attachment> || <background-clip> ]
    inherit
    補足: background-color は、最後に記述された background で定義され、一つの背景色だけが要素全体に適用されます。

    以下の値を一つ以上、任意の順に記述します:

    <background-color>
    背景色を設定
    <background-image>
    背景画像を設定
    <background-position>
    背景画像の位置を設定
    <background-size>
    背景画像のサイズの決定方法を設定
    <background-repeat>
    背景画像の x 軸 / y 軸方向への繰り返しの有無を設定
    <background-attachment>
    包含ブロックに対して背景を固定するか否かを設定
    <background-clip>
    背景色と背景画像の描画領域を設定
    注意: 有効な宣言を与えると、最初の background プロパティは個々の background プロパティにそれらの初期値としてセットし、その結果として宣言で明示的な値として指定したものが割り当てられます。それぞれの個々のプロパティに値を指定する必要がなければ、初期値から変更したいものだけを変更してください。

    実際の表示を確認

    body { background: red; }
    
    .topbanner { background: url("topbanner.png") #00D repeat-y fixed; }

    仕様

    仕様書 策定状況 コメント
    CSS Backgrounds and Borders Module Level 3 勧告候補 短縮プロパティが拡張され、複数の background と新しい background-size プロパティと background-clip プロパティをサポートします。
    CSS 2.1 勧告 重要な変更なし。
    CSS 1 勧告  

    ブラウザ実装状況

    機能 Firefox (Gecko) Chrome Internet Explorer Opera Safari
    基本サポート 1.0 (1.7 or earlier) 1.0 4.0 3.5 1.0
    複数の背景 3.6 (1.9.2) 1.0 9.0 10.5 1.3
    background への SVG 画像の適用 4.0 (2.0) (有) 9.0 # (有) (有)
    background-size のサポート 18.0 (18.0) 21.0 # 9.0 (有) 未サポート
    機能 Firefox Mobile (Gecko) Android IE Phone Opera Mobile Safari Mobile
    基本サポート 1.0 (1.9.2) 2.1 ? 10.0 3.2
    複数の背景 1.0 (1.9.2) 2.1 ? 10.0 3.2
    background への SVG 画像の適用 4.0 (2.0) ? ? ? ?
    background-size のサポート 18.0 (18.0) 未サポート (有) (有) 未サポート

    関連情報

    ドキュメントのタグと貢献者

    Contributors to this page: ethertank, Piro, Ed.Kick.Tiger, Marsf
    最終更新者: ethertank,
    サイドバーを隠す