HTML Links
- Vorige pagina HTML CSS
- Volgende pagina HTML Afbeeldingen
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.
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:
- Door het gebruik van de href-eigenschap - Maak een link naar een ander document
- 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>
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. |
- Vorige pagina HTML CSS
- Volgende pagina HTML Afbeeldingen