Il pseudo-selettore any-link
è un selettore CSS che consente di selezionare gli elementi che sono sorgenti di un link ipertestuale, ovvero tutti gli elementi che hanno un attributo href
. L’attributo è nativo dei tag <a>
, <link>
e <area>
. Maggiori informazioni sono disponibili sul documento di specifica HTML.
Ogni elemento che accetta e ha un attributo href è un link ipertestuale e come tale verrà selezionato con :any-link. Questo strumento è piuttosto utile nel caso volessimo selezionare tutti i link all’interno di un documento HTML che potrebbero sembrare slegati e senza modificare il markup della pagina.
Questo selettore possiamo definirlo una versione potenziata di :link
, dato che questo seleziona tutti i link escludendo quelli nello stato :visited
, mentre :any-link
unisce tutto.
Ecco di seguito un esempio con il selettore :any-link
in azione:
<a href="#">Questo è un link!</a>
:any-link {
color: red;
background-color: yellow;
}
È utile tenere in considerazione che si potrebbe ottenere lo stesso risultato anche con il selettore :matches()
, infatti utilizzando :matches(:link, :visited)
potremmo selezionare gli stessi elementi che otteniamo con :any-link
.
Degno di nota è il fatto che attualmente la specifica attuale è alla ricerca di un nome alternativo per questo selettore. Non è chiaro se il nome cambierà in futuro, ma sappiamo che in passato il selettore :matches()
si chiamava :any()
, e questo potrebbe sicuramente essere un indizio.
Supporto dei Browser
Il pseudo-selettore :any-link
è considerata ancora una funzione sperimentale ed è parte della specifica Selettori di Livello 4, che è attualmente in bozza.
Per il supporto completo è necessario utilizzare i vari prefissi:
:-webkit-any-link {
}
:-moz-any-link {
}
:any-link {
}
Si ricorda di non separare i selettori con le virgole e inserirli in un’unica regola dato che i browser ignorano interamente le regole con parti a loro non comprensibili.
[caniuse feature=”css-any-link”]