Bordi perfetti sulle immagini

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.

Leave a Reply

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

Iscriviti alla newsletter e scarica il pdf
"La mia professione in crescita grazie al web, da dove cominciare?"

…se vuoi ricevere periodicamente qualche consiglio su come spingere la tua attività sul web

Lauryn è un progetto che esiste dal 2001 ed è ideato da Laura Gargiulo, web designer ed esperta di web marketing.

Laura Gargiulo | professionista ai sensi della Legge 4/2013 | Via Arrigo Minerbi 3, 20142 Milano – PI IT10339790965‬ |
Tutti i diritti riservati© 2025 Created with Royal Elementor Addons