![]()
Nella versione 3 dei css sono stati introdotti dei nuovi selettori (ossia dei codici/caratteri in grado di selezionare elementi con determitate carattristiche).
Uno dei nuovi è il selettore cappuccio (^), che ci consente di porre la nostra attenzione su una gli elementi un cui attributo (ad esempio) comincia con una determinta stringa.
Selezionare i link
Ad esempio ci potrebbe interessare la selezione di tutti i link verso siti esterni, questo risultato lo potrmmo ottenere scrivendo qualcosa tipo:
a[href^="http://"] {
background:url(img/external_link.png) no-repeat;
padding-right:25px;
}
Modificare i link
Questo codice aggiunge una particolare icona su tutti i link verso l’esterno, questa soluzione funziona solamente se si usano i collegamenti relativi per le pagine del nostro sito ed assoluti verso siti esterni, qualora non fosse così dovremmo utilizzare il selettore ^ in una maniera più articolata.
a[href^="http://"] {
background:url(img/external_link.png) no-repeat;
padding-right:25px;
}
a[href^="http://www.miosito.ext"] {
background:none;
padding-right:none;
}
In questo caso abbiamo prima assegnato l’icona a tutti i link poi l’abbiamo eliminata da quelli verso il nostro sito, notiamo che questa è la soluzione più semplice altrimenti avremmo dovuto creare una regola css per ogni sito esterno.