attribut BACKGROUND-REPEAT

Rôle

L’attribut background-repeat permet de gérer la répétition d’une image de fond à un élément HTML. Par défaut une image de fond est répétée horizontalement et verticalement.

Version : CSS1

Héritage (inherit) : non

Propriété Javascript : element.style.backgroundRepeat

Testez vous-même cet attribut

Utilisez Codepen.

– Le code CSS

div{
  width: 400px;
  height: 200px;
  border: silver thin solid;
  background-image: url(http://lorempixel.com/200/100/);
  background-repeat: repeat-y;
}

– Le code HTML

Résultat

Compatibilité

L’attribut background-repeat est pris en charge par tous les principaux navigateurs

Valeurs

Les différentes valeurs de l’attribut background-image sont:

repeat

L’image est répétée horizontalement et verticalement : valeur par défaut
Syntaxe :
background-repeat : repeat

no-repeat

L’image n’est pas répétée
Syntaxe :
background-repeat : no-repeat

repeat-x

L’image est répétée seulement horizontalement
Syntaxe :
background-repeat : repeat-x

repeat-y

L’image est répétée seulement verticalement
Syntaxe :
background-repeat : repeat-y

initial

La répétition est défini à sa valeur initiale (attention pas pris en charge par Internet Explorer et Opéra en dessous de la version 15). Peut être utilisé pour « neutraliser » une spécificité, par exemple une image peut ignorer la répétition d’une image de fond imposée par une feuille de style qui le cible.
Syntaxe :
background-repeat : initial

inherit

Hérite de la même propriété que l’élément parent.
Syntaxe :
background-repeat : inherit

A voir aussi

background– background-color– background-image– background-position– background-repeat–background-size– background-origin– background-clip– background-attachment