Forse qualcuno navigando navigando questo sito con il tasto Tab o lasciando un attimo il cursore su determinati link si sarà accorto che questi vengono evidenziati da un colore giallo di sfondo.
Non si tratta di uno sfizio grafico (oddio, potrebbe essere anche così e non ci sarebbe niente di male), ma di un aiuto fornito a chi ha problemi di mobilità o di ipovisione: lo sfondo evidenzia il link e mostra l’area sensibile utile per la selezione.
La regola CSS che permette di ottenere questo risultato è la seguente:
a[href]:hover, a[href]:focus, a[href]:active{background-color:#FFFFC4; padding:.5em 0 .5em 0;}
La regola utilizza i selettori di attributo e, in pratica, applica all’attributo href dell’elemento <a> un colore di sfondo e viene definita un’area di padding intorno al link.
Il padding definisce la dimensione dell’area sensibile, e quindi estende la possibilità di clic a uno spazio più ampio di quello normale, facilitando così la selezione del link anche a chi utilizza per navigare periferiche alternative o la tastiera.
Biroblu 
ciao Livio! grazie della info, non molti conoscono il valore della pseudoclasse active. ma una domanda: perchè usare il selettore di attributo in questo caso invece che il semplice tag?
Mi sembra implicito: perché volevo applicare la regola all’attributo href… oppure non ho capito.
forse non ho capito io 😀
ma non è ridondante dirgli [href] quando comunque tutti i link hanno necessariamente quell’attributo? o era un esempio per mostrare cosa sono i selettori di attributo e come selezionarli?
grazie 🙂
No, l’elemento a può avere diversi attributi e nel mio caso volevo fosse attivo su href. Certo nulla vieta di fare diversamente, ovvio.
ps: non è vero che tutti i link hanno *necessariamente* quell’attributo, per esempio <a name=”C4″ >qualcosa</a> è un link ma href non c’è.