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”]