HTML Links

HTML uses hyperlinks to connect to another document on the network.

Links can be found almost on all web pages. Clicking on a link can jump from one page to another.

Voorbeeld

Create Hyperlinks
This example demonstrates how to create links in an HTML document.
Use an image as a link
This example demonstrates how to use an image as a link.

(More examples can be found at the bottom of this page)

HTML Hyperlinks (Links)

Hyperlinks can be a word, a phrase, or a group of words, or even an image. You can click on these to jump to a new document or a specific part of the current document.

When you move the mouse pointer over a link on a web page, the arrow turns into a small hand.

We create links by using the <a> tag in HTML.

Er zijn twee manieren om de <a>-tag te gebruiken:

  1. Door het gebruik van de href-eigenschap - Maak een link naar een ander document
  2. Door het gebruik van de name-eigenschap - Maak een bookmark in het document

Meer lezen:Wat is hyper tekst?

Syntaxis van HTML-link

De HTML-code van een link is eenvoudig. Het ziet er ongeveer zo uit:

<a href="url">Linktekst</a>

De href-eigenschap bepaalt het doel van de link.

De tekst tussen de start- en eindtag wordt weergegeven als een hyperlink.

Voorbeeld

<a href="http://www.codew3c.com/"">Bezoek CodeW3C.com</a>

Deze regel wordt weergegeven als:Bezoek CodeW3C.com

Klik op deze hyperlink om de gebruiker naar de homepage van CodeW3C.com te brengen.

Tip:"Linktekst" hoeft niet perse tekst te zijn. Afbeeldingen of andere HTML-elementen kunnen ook links zijn.

HTML-link - Target-eigenschap

Met de Target-eigenschap kunt u definiëren waar het gelinkte document wordt weergegeven.

Deze regel opent het document in een nieuw venster:

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

Probeer het zelf!

HTML-link - name-eigenschap

De name-eigenschap bepaalt de naam van de anker (anchor).

U kunt een bookmark in een HTML-pagina maken met de name-eigenschap.

Bookmarks worden niet op enige speciale manier weergegeven, ze zijn onzichtbaar voor de lezer.

Bij het gebruik van naamgegeven anker (named anchors) kunnen we links maken die direct naar deze naamgegeven anker (bijvoorbeeld een subsectie in de pagina) springen, zodat gebruikers niet voortdurend moeten scrollen om de informatie te vinden die ze nodig hebben.

Syntaxis van een naamgegeven anker:

<a name="label">Anker (tekst die op de pagina wordt weergegeven)</a>

Tip:De naam van de anker kan elke naam zijn die u wilt.

Tip:U kunt de id-eigenschap gebruiken om de name-eigenschap te vervangen, de aanroepnaam van de anker werkt ook goed.

Voorbeeld

Eerst noemen we de anker in het HTML-document (maak een favoriet):

<a name="tips">Basisvoorschriften - Handige tips</a>

Vervolgens maken we in hetzelfde document een link naar deze anker:

<a href="#tips">Handige tips</a>

U kunt ook een link naar deze anker op andere pagina's maken:

<a href="http://www.codew3c.com/html/html_links.asp#tips"">Nuttige tips</a>

In de bovenstaande code voegen we het teken # en de naam van de anker toe aan het einde van de URL, zodat we direct naar de anker 'tips' kunnen koppelen.

Specifieke effecten:Nuttige tips

Basisvoorschriften - Nuttige tips:

Opmerking:Voeg altijd een rechte streep toe aan de submap. Als je de link zo schrijft: href="http://www.codew3c.com/html" zal de server twee HTTP-verzoeken genereren. Dit komt omdat de server een rechte streep toevoegt aan dit adres en een nieuwe verzoek maakt, zoals dit: href="http://www.codew3c.com/html/".

Tip:Naamgeanchor worden vaak gebruikt om een inhoudsopgave te maken aan het begin van een groot document. Je kunt een naamgeanchor toekennen aan elke sectie en de koppelingen naar deze anchor's in het bovenste deel van het document plaatsen. Als je vaak百科全书 raadpleegt, zul je merken dat bijna elke item op deze manier wordt genavigeerd.

Tip:Als de browser de genaamdete vermelding die is gedefinieerd, niet kan vinden, zal deze naar het begin van het document navigeren. Er zal geen fout optreden.

Meer voorbeelden

Open een koppeling in een nieuw browservenster
Dit voorbeeld toont hoe je een pagina in een nieuw browservenster kunt openen, zodat bezoekers je site niet hoeven te verlaten.
Koppelen naar een andere locatie op dezelfde pagina
Dit voorbeeld toont hoe je naar een ander deel van het document kunt navigeren met een koppeling
Ontsnappen aan het frame
Dit voorbeeld toont hoe je kunt ontsnappen aan een frame, als je pagina in een frame is geplaatst.
Maak een e-mailkoppeling
Dit voorbeeld toont hoe je naar een e-mail kan koppelen. (Dit voorbeeld werkt alleen als je een e-mailclient hebt geïnstalleerd.)
Maak een e-mailkoppeling 2
Dit voorbeeld toont een complexere e-mailkoppeling.

HTML Link Tag

Tag Beschrijving
<a> Definieer een anker.