disign | CSS: differenziare i link | a digital sign for a best design!
A digital sign for a best design

Articolo stampato da http://disign.improntedigitali.it/css-differenziare-i-link-342-3-1.html

© Luca Frassineti

Css tips and tricks 3.274 visualizzazioni

CSS: differenziare i link

27/02/2012

Attraverso CSS possiamo differenziare la formattazione dei link anche in base alla destinazione del link stesso: ovvero visualizzare diversamente i link interni dai link a siti esterni, oppure i link su email o su formati di file specifici (musicali, video, zippati etc etc).
Una volta compresa la sintassi, estremamente semplice, possiamo sbizzarirci in moltissime differenziazioni con pochisisme righe di codice!
Ecco un esempio (in cui modifico solo il colore, solo per brevità):

        /*  qualsiasi link esterno */
a[href^="http://"] {
        color: red;
}

        /* link a indirizzo specifico */
a[href="http://www.google.it"] {
        color: green;
}

        /* link interni */
a[href^="/"], a[href^=".."] {
        color: blue;
}

        /* link email */
a[href^="mailto:"] {
        color: orange;
}

        /* link a pdf */
a[href$=".pdf"] {
        color: purple;
}

        /* link a file mp3 */
a[href$=".mp3"] {
}

        /* link a file zippati */
a[href$=".zip"] {

}

Invia una domanda o un commento sull'articolo

I campi obbligatori sono segnalati *

*

*



 


Questo sito è totalmente privo di pubblicità, se volete sostenere questa inziativa, potete scegliere di fare una piccola donazione libera:


© 2009 - 2023 Impronte digitali di Luca Frassineti. Tutti i diritti riservati.