Discussion :

[Bovino]

Aujourd'hui, Pascale Lambert ne nous propose pas un tutoriel mais plus une astuce. En effet, à l'aide d'un court exemple, elle nous donne une méthode pour ajouter plusieurs images de fond à un document HTML.

N'hésitez pas à faire part de vos remarques, questions et encouragements à la suite de ce message.

Voir aussi les cours et tutoriels CSS.

Merci à elle

[adiGuba]

Salut,


A noter que les CSS3 autorisent l'utilisation de multiple-background sur un même élément : http://www.w3.org/TR/css3-background/#layering

Du coup il n'y a plus besoin de multiplier les div :

Code CSS :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
#contenu {
	background-image: url(houx2.gif), url(houx2.gif), url(houx2.gif), url(houx2.gif);
	background-position: top left, top right, bottom left, bottom right;
	background-repeat: no-repeat;
 
	padding-left: 100px;
	padding-right: 100px;
}

Par contre cela ne fonctionne pas sur tous les navigateurs...

a++

[Kerod]

Et surtout ce n'est pas prêt d'arriver vu que le CSS3 est toujours à l'état d'écriture.

Donc pour avoir quelque chose de compatible avec tous les navigateurs du moment, il vaut mieux utiliser la méthode décrite par Pascale.

[adiGuba]

Oui je n'ai jamais dit le contraire. Mais c'est quand même implémenté dans les dernières versions des navigateurs modernes. Seul IE est à la traine...

Il me semble que c'est prévu dans IE9...


a++

[Kerod]

Il n'y a pas de soucis. C'est une solution alternative pour ceux qui souhaitent ne pas faire ce genre de choses. Le seul problème c'est que ce n'est pas compatible tout navigateur (il doit avoir que les dernières version de Opera, Firefox et Safari qui l'implémente).

Après il y a aussi les solutions avec JavaScript mais c'est lourd et surtout s'il y a une désactivation du JavaScrip ça ne fonctionne plus.

C'est ça le problème des versions navigateurs, ils devraient forcer leur suppression des postes (je parle des constructeurs ^^).

[Vincent BONNAL]

Bonjour,
J'ai une petite question, pour ma culture perso... pourquoi imbriquer les div?

Vincent.

[Erwan31]

Et surtout ce n'est pas prêt d'arriver vu que le CSS3 est toujours à l'état d'écriture.

Salut Kerod
en fait pas tout à fait > http://www.w3.org/Style/CSS/current-work#background
Le module comprenant les background est en CR et donc implémentable depuis décembre. C'est un des avantages de la division de CSS3 en plusieurs modules.

Si la totalité des background n'est pas nécessaire pour l'accessibilité de la page,
on peut toujours passer par JS (si ça ne nuit pas de manière importantes aus perf d'affichages).

[adiGuba]

Il reste quand même le problème des navigateurs : il faudra attendre au moins IE9 pour voir cela se généraliser un peu...


a++

[Kerod]

Sans compté les réticents qui ne veulent pas changer de navigateur. IE6 est toujours présent dans les administrations