Come eliminare i bordi delle immagini con i CSS
Le immagini inserite nelle pagine HTML hanno, in genere quando linkate, un bordo di default. Anche se in parecchi siti questo bordo non viene mostrato perchè l'effetto visivo spesso non è dei migliori.
In HTML il bordo delle immagini è controllato dall'attributo "border" del tag img :
<img src="file.gif" border="0" alt="" /> non mostra il bordo
<img src="file.gif" border="1" alt="" /> mostra il bordo
Questo metodo può andare bene quando vogliamo impostare il bordo di una sola immagine.
Mentre tramite CSS possiamo impostare una regola valida per tutte le immagini, senza dover intervenire ogni volta sul'HTML di ogni immagine.
img {border:0;}
Il codice qui sopra, inserito oppourtunatamente nel nostro file .css, disabilita il bordo di tutte le immagini. Volendo possiamo impostare delle regole più selettive, ad esempio:
div .senza_bordo img {border:0;}
non mostra il bordo delle immagini contenute nei div con classe "senza_bordo", come nell'esempio qui sotto:
<div class="senza_bordo">
<a href="#"><img src="libri.gif" alt="" /></a>
</div>