Pour le site des cours de photo, qui sera prochainement lancé, j’ai dû faire des boxes à coins arrondis.
Voici les ressources que j’ai utilisées :
Un bon résumé, bien que je ne sois pas à proprement parler débutante (quand même douze ans d’expérience en création de sites web, hein, mais je ne retiens jamais les syntaxes exactes !) : Image de fond en CSS background-image dans une page html – CSS Debutant.
Ils proposent cette ressource sympa : http://www.pompage.net/pompe/les-bases-du-background/ qui fait le point définitif sur la question
Et la découverte du jour :le site qui va me faire gagner un temps insensé à chaque fois que je devrai faire une box à coins arrondis. Il les fait en CSS ou en GIF. Magnifque !
Puisque mon propos est de me souvenir des propriétés du fond :
background-color:
#000000; /*
|transparent
|inherit */
background-image:
url(image.gif); /* pas de guillemets, je m’en souviendrai !*/background-repeat:
no-
repeat
/* |repeat-x
= dans le sens horizontal |repeat-y
|repeat
|inherit*/
background-position:
100px 200px /*
100px du côté gauche de l’élément, et à 200px sous son côté supérieur */background-position:
70%
50% /*
left: 70%
ettop: 50% */
background-position: left top; /* sympa aussi */
background-position: center top; /* équivaut à 50% 0% */
background-attachment:
scroll
/* |fixed
|inherit ,; je ne m'en sers jamais :
une image de fond est toujours placée par rapport à la fenêtre d’affichage, et pas par rapport à l’élément dans lequel elle réside.*/
- background-color: inherit; /*
inherit
permet à l’élément d’hériter de la propriétébackground-color
de son parent.*/