Zoomart Design - Web Agency Napoli
Sfondi multipli con CSS3
11 agosto 2010
CSS3 permette di utilizzare più di un’immagine di sfondo. Per ottenere qusto risultato è necessario separare le diverse immagini che si vuole utilizzare con una virgola, il risultato è mostrato di seguito:
Multiple background test
Mentre prima si dovevano utilizzare 4 div per ottenere il risultato visualizzato, adesso, con questa proprietà, ne basta uno!
Il CSS uilizzato per ottenere immagini di sfondo multiple è:
background: url(body-top.gif) top left no-repeat,
url(banner.jpg) top 11px no-repeat,
url(body-bottom.gif) bottom left no-repeat,
url(body-middle.gif) left repeat-y;
url(banner.jpg) top 11px no-repeat,
url(body-bottom.gif) bottom left no-repeat,
url(body-middle.gif) left repeat-y;
E questo è lo screenshot del risultato, nel caso non fosse visualizzato correttamente:
Altri articoli che ti potrebbero interessare:
Zoomart in "The Digital Agenda" pubblicato dalla Luxury Society
Zoomart su Awwwards
Zoomart torna su Awwwards