Les navigateurs prenant en charge plusieurs arrière-plans (WebKit depuis les tout premiers jours, Firefox 3+) utilisent une syntaxe comme celle-ci:
#box ( background: url(icon.png.webp) top left no-repeat, url(texture.jpg.webp), url(top-edge.png.webp) top left repeat-y; )Ce sont des valeurs séparées par des virgules et il peut y en avoir autant que vous le souhaitez avec différentes URL, positionnement et valeurs de répétition. Vous pouvez même combiner des dégradés WebKit dans le mélange:
#box ( background: url(… /images/arrow.png.webp) 15px center no-repeat, -webkit-gradient(linear,left top,left bottom,color-stop(0, #010101),color-stop(1, #181818)); )Old school IE sur Mac afficherait le premier arrière-plan de la liste, mais les autres navigateurs qui ne le prennent pas en charge échouent durement et n'afficheront simplement aucun arrière-plan. Cela en fait un cas difficile pour une amélioration progressive. Autrement dit, à moins que vous n'utilisiez un outil tel que Modernizr pour détecter sa prise en charge et écrire un sélecteur de secours qui ne déclare qu'un seul arrière-plan pour les navigateurs qui ne le prennent pas en charge.