Webelix.net :: CSS - La propriété Background

Inscription
fleche

Mot de passe oublié ?

Les 6 dernières pages de Cours et Dossiers ajoutées

(01/01/2008) PHP - Expression Rationnelle PREG_REPLACE
(01/01/2008) Trucs et Astuces - (PHP) Supprimer les espaces en trop dans une chaîne
(26/12/2007) Trucs et Astuces - (HTML) Jukebox vidéo en flash
(02/12/2007) Trucs et Astuces - (PHP) Manipulation des Dates
(10/11/2007) Trucs et Astuces - (JavaScript) Masquer/Désactiver des champs de formulaire
(02/11/2007) Trucs et Astuces - (JavaScript) Liste d'options dynamique

Informations Générales

Chargement en cours...

Nombre de Visites fleche

[ 139904 ]
Votre IP fleche

[ 38.103.63.16 ]

Vous êtes ici : Home Page

Cours

CSS

Propriete background

Imprimer

Informations Membres

	[195] Posts sur le forum
	[177] Membres inscrits

Il y a en ligne :

0 Membre

2 Invités

Membre en ligne:
Aucun

Partenariat

Vous pouvez aider ce site à évoluer, en contribuant à son développement. Proposez vos idées de cours et/ou dossiers. Rendez-vous dans « Partenariat » pour en savoir plus.

Nom de domaine

Partenaires

La propriété Background

Cette propriété définit l'ensemble des caractéristiques précitées, c'est-à-dire dans l'ordre :
la couleur, l'image de fond, le mode de répétition, le défilement de l'image et son positionnement dans un bloc contenant.
Toutes les valeurs doivent être séparées par un espace blanc et aucun ordre est imposé.

Elle regroupe les différentes propriétés :

background-color
background-image
background-repeat
background-attachment
background-position

background
Valeur	none Voir ci-dessous (background-color) (background-image) (background-repeat) (background-attachment) (background-position)
Type	CSS 1
Compatibilité	5+ 4+ 4+ 9+
Valeur par défaut	none
Domaine d'application	Tous les éléments.
Héritage	non
Media	visuel

Valeur possible	Action	Exemple
Couleur	Une couleur s'applique dans le fond de l'élément.	p {background: yellow}
Image, Fixe, Position	L'élément se positionne par rapport à des valeurs fixes.	body {background: url(image.gif) fixed left}
Couleur, Image, Répétition, Défilement, Position	Au-dessu d'un fond de couleur, une image se répète horizontalement, défile avec le contenu et se positionne au centre.	table { background: rgb(255, 255, 0) url(../image.gif) repeat-x scroll center }
Image, Défilement, Répétition, Position	Une image se positionne en haut et au centre, ne défile pas et n'est pas répétée.	p { background: 50% center url(image.jpg) fixed no-repeat }

Exemples

Une couleur s'applique dans le fond de l'élément.

cellule	cellule	cellule
cellule	cellule	cellule

table {background: yellow}

Une image se positionne en haut et a gauche.

cellule	cellule	cellule
cellule	cellule	cellule

table {background: url(image1.jpg) left top}

Une image se positionne en haut et a gauche, et se répète.

cellule	cellule	cellule
cellule	cellule	cellule

table {background: url(image2.gif) repeat left top}

Une image se positionne en haut et a gauche, et se répète horizontalement, avec une couleur de fond jaune.

cellule	cellule	cellule
cellule	cellule	cellule

table {background: yellow url(image2.gif) repeat-x left top}