Velkommen til lektion 8. I denne lektion lærer du at lave links mellem sider.
Til at lave links skal du bruge det, du altid bruger når du koder HTML: et tag. Et simpelt lille tag med ét element og én attribut, og du kan linke til alt og alle. Her er et eksempel på hvordan et link til html.dk ville se ud:
Eksempel 1:
<a href="http://www.html.dk">Her er et link til html.dk</a>
Ville se sådan ud i browseren:
Elementet a står for "anchor", som er engelsk for "anker". Attributten href er en
forkortelse af " Hypertext REFerence", hvilket betyder "Det er her linket går til" (sådan cirka).
href sættes lig "http://www.html.dk", hvilket er den fulde adresse på html.dk, og kaldes en URL (Uniform Resource Locator) (bemærk "http://", der også skal medtages). Sætningen "Her er et link til html.dk" er det der ses i browseren som et link. Husk at lukke taget med et </a>.
Hvis du linker mellem sider der deler placering, behøver du ikke skrive hele adressen (URL'en). Hvis du f.eks. har lavet to sider (side1.htm & side2.htm) og gemt dem i samme folder (f.eks. under "Dokumenter" på harddisken), kan du linke fra den ene side til den anden med kun navnet på siden. Et link fra side1.htm til side2.htm ville derfor se sådan ud:
Eksempel 2:
<a href="side2.htm">Et link til side 2</a>
Ligger side 2 i en underfolder (navngivet "underfolder"), kan linket se sådan ud:
Eksempel 3:
<a href="underfolder/side2.htm">Et link til side 2</a>
Et link den anden vej fra side 2 (i underfolderen) til side 1 vil da se sådan ud:
Eksempel 4:
<a href="../side1.htm">Et link til side 1</a>
"../side1.htm" gør at der hoppes et niveau tilbage før der kigges efter filen. Man kan også hoppe to niveauer tilbage, så ser det sådan ud: "../../side1.htm".
Forstod du systemet? Ellers kan du selvfølgelig altid bruge den fulde adresse (URL'en).
Vil man have links internt på sine sider, kan det også sagtens lade sig gøre. F.eks. en indholdsfortegnelse øverst med links til hvert afsnit nedenfor. Du skal blot bruge attributten id. Med id-attributten kan du give tag en unik identifikation.
Eksempel 5:
<h1 id="overskrift1">Overskrift 1</h1>
Du kan nu linke til det specifikke tag. I linket skrives blot et "#" (så ved browseren at den skal blive på samme side) efterfulgt af det id du vil linke til:
Eksempel 6:
<html>
<head>
</head>
<body>
<p><a href="#overskrift1">Link til overskrift 1</a></p>
<p><a href="#overskrift2">Link til overskrift 2</a></p>
<h1 id="overskrift1">Overskrift 1</h1>
<p>Tekst tekst tekst tekst</p>
<h1 id="overskrift2">Overskrift 2</h1>
<p>Tekst tekst tekst tekst</p>
</body>
</html>
Vil se sådan ud i browseren (prøv at klikke på de to links):
Tekst tekst tekst tekst
Tekst tekst tekst tekst
Ja, man kan godt linke til en e-mail adresse. Måden at gøre det på er den samme, som når du linker til en side:
Eksempel 7:
<a href="mailto:info@html.dk">Send en e-mail til html.dk</a>
Vil se sådan ud i browseren:
Forskellen er, at du i stedet for at skrive adressen på en side, skriver et "mailto:" efterfulgt af e-mail adresse. Når du klikker på linket, åbner du automatisk dit e-mail program med en ny besked adresseret til info@html.dk. Denne funktion vil dog kun virke, hvis der er installeret et e-mail program på computeren. Prøv.
For at lave et link skal du altid bruge href. Herudover kan du bl.a. også sætte en titel på dit link:
Eksempel 8:
<a href="http://www.html.dk" title="Link til html.dk">Her er et link til html.dk</a>
Ville se sådan ud i browseren:
Attributten title kan bruges til at skrive et kort beskrivelse af linket. Hvis du - uden at klikke - holder musen henover linket, vil du se at teksten "Link til html.dk" kommer frem.
