HTML <a> Tag

Definitie en gebruik

<a> De tag definieert een hyperlink, die wordt gebruikt om van een pagina naar een andere pagina te linken.

<a> De belangrijkste eigenschap van het element is href-eigenschaphet doel van de link aangeeft.

Standaard worden links in alle browsers weergegeven als volgt:

  • De link die je nog niet hebt bezocht is met een onderstreping en blauw
  • De link die je eerder hebt bezocht is met een onderstreping en paars
  • De link die je nu bezoekt is met een onderstreping en rood

Tip:Je hebt mogelijk al opgemerkt dat de links op de CodeW3C.com-website zeer verschillend uitzien van de standaard linkuitzicht. Je kunt CSS pseudo-classes Voeg complexe en diverse stijlen toe aan teksthyperlinks.

Zie ook:

HTML handleiding:HTML links

HTML DOM referentiehandleiding:Anchor object

CSS handleiding:Linkstijl

Terminologie uitleg

What is hyper text?

Voorbeeld

Voorbeeld 1

Maak een link naar codew3c.com:

<a href="https://www.codew3c.com">Bezoek codew3c.com!</a>

Probeer het zelf uit

Voorbeeld 2

Hoe je een afbeelding als link te gebruiken:

<a href="https://www.codew3c.com">
<img border="0" alt="W3School" src="w3logo.png" width="400" height="225">
</a>

Probeer het zelf uit

Voorbeeld 3

Hoe je een link opent in een nieuw browservenster:

<a href="https://www.codew3c.com" target="_blank">Bezoek codew3c.com!</a>

Probeer het zelf uit

Voorbeeld 4

Hoe je een e-mailadres te linken:

<a href="mailto:someone@example.com">Stuur een e-mail</a>

Probeer het zelf uit

Voorbeeld 5

Hoe je een telefoonnummer te linken:

<a href="tel:+8613888888888">+86 138 8888 8888</a>

Probeer het zelf uit

Voorbeeld 6

Hoe je naar een ander deel van dezelfde pagina kunt linken:

<a href="#section2">Ga naar het tweede hoofdstuk</a>

Probeer het zelf uit

Voorbeeld 7

Hoe je naar JavaScript kunt linken:

<a href="javascript:alert('Hello World!');">JavaScript uitvoeren</a>

Probeer het zelf uit

Tips en opmerkingen

Tip:Als de <a>-tag geen href-attribuut heeft, is het slechts een placeholder voor een hyperlink.

Tip:De gelinkte pagina wordt meestal weergegeven in het huidige browservenster, tenzij je een ander doel hebt ingesteld (met het target-attribuut).

Tip:Gebruik CSS-instellingen om de stijl van de link in te stellen:CSS links en CSS buttons.

Eigenschap

Eigenschap Waarde Beschrijving
Download Bestandsnaam Stelt het doel vast dat wordt gedownload wanneer de gebruiker op de hyperlink klikt.
Href URL Stelt de URL van de pagina vast waarnaar de link verwijst.
Hreflang Taalcode Stelt het taalcode van het gelinkte document vast.
Media Media query Stelt vast voor welke media of apparaten het gelinkte document is geoptimaliseerd.
Ping URL-lijst Stelt een lijst van URL's vast, gescheiden door spaties, die worden verzonden wanneer de link wordt bezocht. Dit wordt meestal gebruikt voor het volgen.
Referrer policy
  • Geen referrer
  • Geen referrer bij verlagen
  • Oorsprong
  • Oorsprong bij kruisbesturing
  • Zelfde oorsprong
  • Strikte oorsprong bij kruisbesturing
  • Onveilige URL
Stelt de referentie-informatie vast die samen met de link moet worden verzonden.
Rel
  • Alternatief
  • Auteur
  • Bladwijzer
  • Externe
  • Hulp
  • Licentie
  • Volgende
  • Geen volg
  • Geen referentie
  • Geen venster
  • Vorig
  • Zoek
  • Tag
Stelt het verband tussen het huidige document en het gelinkte document vast.
Doel
Stelt vast waar het gelinkte document geopend moet worden.
type Media Type Stelt het mediatype van het gelinkte document vast.

Globale attributen

<a> De tag ondersteunt ook Globale attributen in HTML.

evenement-attributen

<a> De tag ondersteunt ook Evenement-attributen in HTML.

Standaard CSS-instellingen

De meeste browsers zullen de volgende standaardwaarden weergeven: <a> Element:

a:link, a:visited {
  color: (internal value);
  text-decoration: underline;
  cursor: auto;
{}
a:link:active, a:visited:active {
  color: (internal value);
{}

Browser support

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Support Support Support Support Support