HTML & CSS

最終更新日:
公開日:

リファレンス

CSS

バックグラウンド

backgroundプロパティ

背景についての設定をまとめて指定します。

  • 初期値

    各プロパティの初期値に準ずる

  • 継承

    不可

  • 適用できる要素

    全要素

背景画像、背景色、繰り返し

背景画像のURL、背景色カラーコード、背景画像の繰り返し表示を一括で設定する例です。

CSSコード例

background: url(/wp-content/uploads/2016/06/bg_sample.jpg) #91c5ff no-repeat;

表示例:


背景画像、背景ポジション、背景画像サイズ、繰り返し

背景画像のURL、背景ポジション、背景画像サイズ、背景画像の繰り返し表示を一括で設定する例です。

各値の設定する順序は基本的に任意ですが、ポジションとサイズの2つを指定する場合のみ規則があります。
値の指定を「ポジション / サイズ」の順で行う必要があり、間に「/(半角スラッシュ)」が必要となります。
また、ポジションとサイズを続けて書く必要があり、間に他プロパティへの設定を書くこともできません。

CSSコード例

background: url(/wp-content/uploads/2016/06/bg_sample.jpg) 30% 10px / 50% auto  no-repeat;

表示例: