magie con i fogli di stile

su altri blog ho visto usare i css per creare degli effetti molto carini in alcuni tipi di tag …

in modo molto semplice questo codice ridefinisce il tag blockquote ( quello che uso per fare una citazione od un commento con le virgolette )
creando uno sfondo colorato e aggiungendo un immagine non ripetuta.

blockquote {
margin: 15px 20px 5px 20px;
padding: 5px 10px 5px 25px;
border: 1px solid #99CCFF;
border-left: 8px solid #99CCFF;
background: #DDEEFF url("/images/quote.gif") no-repeat top left;
}


fate attenzione a creare un’immagine con sfondo trasparente e ricordatevi che ie ( Internet Explorer ) non supporta le png con la trasparenza.

aggiornamento
per definire un comportamento diverso dallo standard ( per esempio il codice che ho riportato sopra) possiamo definire una classe personalizzata e andare ad assegnare al tag che ci interessa il nome della classe personalizzata.

.classepersonalizzata {
margin: 15px 20px 5px 20px;
padding: 5px 10px 5px 25px;
border: 1px solid #99CCFF;
border-left: 8px solid #99CCFF;
background: #DDEEFF url("/images/nuovaimmagine.gif") no-repeat top left;
}


per assegnare la classe …

<p class="classepersonalizzata" >
bla bla bla
</p>