background

  • Raccourci de la révision : CSS/background
  • Titre de la révision : CSS : la propriété background
  • ID de la révision : 50424
  • Créé :
  • Créateur : Kyodev
  • Version actuelle ? Non
  • Commentaire statut à relire enlevé (oubli précédent)

Contenu de la révision

{{template.CSSRef()}}

Résumé

La propriété background est un raccourci pour définir les valeurs des propriétés d'arrière-plan dans une seule et unique règle CSS. background peut être utilisé pour définir les valeurs d'une ou de plusieurs des propriétés suivantes : {{template.Cssxref("background-attachment")}}, {{template.Cssxref("background-color")}}, {{template.Cssxref("background-image")}}, {{template.Cssxref("background-position")}}, {{template.Cssxref("background-repeat")}}.

  • Valeur initiale : voir chacune des propriétés pour les détails
  • Appliquée à : tous les éléments
  • Héritée : non
  • Pourcentages : permis pour {{template.Cssxref("background-position")}}
  • Média : Visuel
  • Valeur calculée : voir les propriétés individuelles

Syntaxe

background: [background-color || background-image ||
    background-repeat || background-attachment ||
    background-position] | inherit]

Valeurs

background-color
Voir {{template.Cssxref("background-color")}}.
background-image
Voir {{template.Cssxref("background-image")}}
background-repeat
Voir {{template.Cssxref("background-repeat")}}.
background-attachment
Voir {{template.Cssxref("background-attachment")}}.
background-position
Voir {{template.Cssxref("background-position")}}.

Exemples

{{template.CSSRefExampleLink("background")}}

body { 
   background: red;
}

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

Notes

Dans une déclaration valide, la propriété background commence par réinitialiser les propriétés d'arrière-plan individuelles à leur valeur initiale, puis leur assigne les valeurs explicitement définies dans la déclaration. Vous n'avez pas à définir une valeur pour chaque propriété individuelle, mais uniquement celles que vous désirez modifier par rapport à leur valeur initiale.

Spécifications

Compatibilité des navigateurs

Navigateur Version minimale
Internet Explorer 4
Firefox 1
Netscape 6
Opera 3.5

Voir également

{{wiki.template('CSS_Reference:Background')}}

Interwiki Language Links

{{ wiki.languages( { "en": "en/CSS/background", "pl": "pl/CSS/background" } ) }}

Source de la révision

<p> 
{{template.CSSRef()}}
</p>
<h3 name="R.C3.A9sum.C3.A9"> Résumé </h3>
<p>La propriété <code>background</code> est un raccourci pour définir les valeurs des propriétés d'arrière-plan dans une seule et unique règle CSS. <code>background</code> peut être utilisé pour définir les valeurs d'une ou de plusieurs des propriétés suivantes : {{template.Cssxref("background-attachment")}}, {{template.Cssxref("background-color")}}, {{template.Cssxref("background-image")}}, {{template.Cssxref("background-position")}}, {{template.Cssxref("background-repeat")}}.
</p>
<ul><li> <a href="fr/CSS/Valeur_initiale">Valeur initiale</a> : voir chacune des propriétés pour les détails
</li><li> Appliquée à : tous les éléments
</li><li> <a href="fr/CSS/H%c3%a9ritage">Héritée</a> : non
</li><li> Pourcentages : permis pour {{template.Cssxref("background-position")}}
</li><li> Média : <a href="fr/CSS/M%c3%a9dia/Visuel">Visuel</a>
</li><li> <a href="fr/CSS/Valeur_calcul%c3%a9e">Valeur calculée</a> :  voir les propriétés individuelles
</li></ul>
<h3 name="Syntaxe"> Syntaxe </h3>
<pre class="eval">background: [<i>background-color</i> || <i>background-image</i> ||
    <i>background-repeat</i> || <i>background-attachment</i> ||
    <i>background-position</i>] | <i>inherit</i>]
</pre>
<h3 name="Valeurs"> Valeurs </h3>
<dl><dt> background-color
</dt><dd> Voir {{template.Cssxref("background-color")}}.
</dd><dt> background-image
</dt><dd> Voir {{template.Cssxref("background-image")}}
</dd><dt> background-repeat
</dt><dd> Voir {{template.Cssxref("background-repeat")}}.
</dd><dt> background-attachment
</dt><dd> Voir {{template.Cssxref("background-attachment")}}.
</dd><dt> background-position
</dt><dd> Voir {{template.Cssxref("background-position")}}.
</dd></dl>
<h3 name="Exemples"> Exemples </h3>
<p>{{template.CSSRefExampleLink("background")}}
</p>
<pre class="eval">body { 
   background: red;
}
<br>
.topbanner {
    background: url("topbanner.png") #00D repeat fixed;
}
</pre>
<h3 name="Notes"> Notes </h3>
<p>Dans une déclaration valide, la propriété <code>background</code> commence par réinitialiser les propriétés d'arrière-plan individuelles à leur valeur initiale, puis leur assigne les valeurs explicitement définies dans la déclaration.  Vous n'avez pas à définir une valeur pour chaque propriété individuelle, mais uniquement celles que vous désirez modifier par rapport à leur valeur initiale.
</p>
<h3 name="Sp.C3.A9cifications"> Spécifications </h3>
<ul><li> <a class="external" href="http://www.yoyodesign.org/doc/w3c/css1/#background">CSS 1</a>
</li><li> <a class="external" href="http://www.yoyodesign.org/doc/w3c/css2/colors.html#q2">CSS 2</a> ou <a class="external" href="http://www.w3.org/TR/CSS21/colors.html#propdef-background">CSS 2.1 (en)</a>
</li><li> <a class="external" href="http://www.w3.org/TR/2005/WD-css3-background-20050216/#the-background">CSS 3 (en)</a>
</li></ul>
<h3 name="Compatibilit.C3.A9_des_navigateurs"> Compatibilité des navigateurs </h3>
<table class="standard-table">
  <tbody><tr>
    <th>Navigateur</th>
    <th>Version minimale</th>
  </tr>
  <tr>
    <td>Internet Explorer</td>
    <td>4</td>
  </tr>
  <tr>
    <td>Firefox</td>
    <td>1</td>
  </tr>
  <tr>
    <td>Netscape</td>
    <td>6</td>
  </tr>
  <tr>
    <td>Opera</td>
    <td>3.5</td>
  </tr>
</tbody></table>
<h3 name="Voir_.C3.A9galement"> Voir également </h3>
<p>{{wiki.template('CSS_Reference:Background')}}
</p><p><span class="comment">Interwiki Language Links</span>
</p>{{ wiki.languages( { "en": "en/CSS/background", "pl": "pl/CSS/background" } ) }}
Revenir à cette révision