Tag HTML <a>
Esempio
Crea un collegamento a W3Schools.com:
<a href="https://www.w3schools.com">Visit W3Schools.com!</a>
Altri esempi "Provalo da solo" di seguito.
Definizione e utilizzo
Il <a>
tag definisce un collegamento ipertestuale, che viene utilizzato per collegare una pagina all'altra.
L'attributo più importante <a>
dell'elemento è l'
href
attributo, che indica la destinazione del collegamento.
Per impostazione predefinita, i collegamenti verranno visualizzati come segue in tutti i browser:
- Un collegamento non visitato è sottolineato e blu
- Un collegamento visitato è sottolineato e viola
- Un collegamento attivo è sottolineato e rosso
Suggerimenti e note
Suggerimento: se il <a>
tag non ha
href
attributi, è solo un segnaposto per un collegamento ipertestuale.
Suggerimento: una pagina collegata viene normalmente visualizzata nella finestra del browser corrente, a meno che tu non specifichi un'altra destinazione.
Suggerimento: usa i CSS per definire lo stile dei link: link CSS e pulsanti CSS .
Supporto browser
Element | |||||
---|---|---|---|---|---|
<a> | Yes | Yes | Yes | Yes | Yes |
Attributi
Attribute | Value | Description |
---|---|---|
download | filename | Specifies that the target will be downloaded when a user clicks on the hyperlink |
href | URL | Specifies the URL of the page the link goes to |
hreflang | language_code | Specifies the language of the linked document |
media | media_query | Specifies what media/device the linked document is optimized for |
ping | list_of_URLs | Specifies a space-separated list of URLs to which, when the link is followed, post requests with the body ping will be sent by the browser (in the background). Typically used for tracking. |
referrerpolicy | no-referrer no-referrer-when-downgrade origin origin-when-cross-origin same-origin strict-origin-when-cross-origin unsafe-url |
Specifies which referrer information to send with the link |
rel | alternate author bookmark external help license next nofollow noreferrer noopener prev search tag |
Specifies the relationship between the current document and the linked document |
target | _blank _parent _self _top |
Specifies where to open the linked document |
type | media_type | Specifies the media type of the linked document |
Attributi globali
Il <a>
tag supporta anche gli attributi globali in HTML .
Attributi dell'evento
Il <a>
tag supporta anche gli attributi dell'evento in HTML .
Altri esempi
Esempio
Come utilizzare un'immagine come collegamento:
<a href="https://www.w3schools.com">
<img border="0" alt="W3Schools"
src="logo_w3s.gif" width="100" height="100">
</a>
Esempio
Come aprire un collegamento in una nuova finestra del browser:
<a href="https://www.w3schools.com" target="_blank">Visit W3Schools.com!</a>
Esempio
Come collegarsi a un numero di telefono:
<a href="tel:+4733378901">+47 333 78 901</a>
Esempio
Come collegarsi a un'altra sezione nella stessa pagina:
<a href="#section2">Go to Section 2</a>
Esempio
Come collegarsi a un JavaScript:
<a href="javascript:alert('Hello World!');">Execute JavaScript</a>
Pagine correlate
Esercitazione HTML: collegamenti HTML
Riferimento HTML DOM: Anchor Object
Esercitazione CSS: Collegamenti di stile
Impostazioni CSS predefinite
La maggior parte dei browser visualizzerà l' <a>
elemento con i seguenti valori predefiniti:
a:link, a:visited {
color: (internal value);
text-decoration: underline;
cursor: auto;
}
a:link:active, a:visited:active {
color: (internal value);
}