color décrit la couleur d'avant-plan d'un élément.h3 { color:navy }
h4 { color:deepskyblue }
p { color:#483D8B }
...
<body>
<h3>Titre h3</h3>
<h4>Titre h4</h4>
<p>Texte du paragraphe.</p>
Texte du paragraphe.
background-color définit la couleur d'arrière-plan.
<style type="text/css">
table { background-color:black; color:white; text-align:center }
tbody { background-color:white; color:black }
...
<table>
<thead>
<tr><th>Colonne 1</th><th>Colonne 2</th></tr>
</thead>
<tbody>
<tr><td>11</td><td>12</td></tr>
<tr><td>21</td><td>22</td></tr>
</tbody>
</table>
</style>
| Colonne 1 | Colonne 2 |
|---|---|
| 11 | 12 |
| 21 | 22 |
background-image:url() définit l'image choisie pour
le fond de page.
comme image d'arrière-plan.
Visualisons !
background-repeat indique si l'image
d'arrière-plan est répétée et la manière de la répétition.repeatrepeat-xrepeat-yno-repeat
comme image d'arrière-plan.
Visualisons !
Et la même image, cette fois-ci dans une boîte :
Code CSS :
<style type="text/css">
div.rectangle {
border:1px solid blue;
width:250px;
height:100px;
background-image: url('css/img/css_header_repeat.png');
background-repeat:repeat-x;
}
...
<div class="rectangle"></div>
background-attachment indique si l'image est fixe par
rapport à la zone de visualisation (la valeur fixed), ou si
celle-ci défile en même temps que le document (la valeur scroll).background-position indique la position initiale
d'une image d'arrière-plan quand celle-ci est spécifiée.top, bottom, left,
right, center.background est une propriété raccourcie qui sert
à regrouper les propriétés individuelles background-color,
background-image, background-repeat,
background-attachment et background-position.