Cesare Lamanna di Edit oggi ci aiuta a formattare i bordi delle immagini, con pochi comandi semplici.
Livello del tutorial: base (non si accettano lamentele da chi è già avanti 😉 )
[…]sul web un bel bordo intorno alle immagini è un gran guadagno in termini estetici e di resa visiva. E metterlo con i CSS è un’operazione più che semplice. Volendo ottenere un effetto ‘doppio bordo’ (esterno e interno) basta sfruttare il padding:
img {
padding:3px;
border:1px solid #000;
}In questo modo la parte interna delle cornice assumerà come colore quello di sfondo definito per l’elemento in cui è contenuta l’immagine. Volendo assegnare un colore diverso basterà impostare un colore di sfondo per l’immagine:
img {
background-color: #ff0;
padding:3px;
border:1px solid #000;
}In fondo al tutorial il link ad una pagina di CSS3.info che documenta l’implementazione su Safari 3 della proprietà
border-image
, tramite la quale sarà possibile impostare come bordi di un elemento anche elementi grafici.