Lektion 7: Links
I lektion 7 vises, hvordan du laver links til både dine egne og til andres websider.
Et link er et område (f.eks. tekst eller grafik) på en webside som er klikbart. Begrebsmæssigt findes der to typer links: Links og Hyperlinks.
Et link udfører en handling på/fra din egen webside. Et hyperlink udfører en handling på/fra en andens hjemmeside. Lad os f.eks. sige at handlingen der udføres er at en webside loades. Hvis linket er et "link" kunne denne handling være href="kontakt.html", hvis handlingen er et hyperlink skulle samme href="" handling skrives således: href="http://www.hjemmesiden.dk/kontakt.html".
Anchor tag'n
Et link laves vha. <a href=""> ..og.. </a> erklæringen. Det du skriver imellem " ..og.. " i href="" koden er den handling der udføres når du klikker med musen på det der stå imellem <a href=""> ..og.. </a>... Et eksempel:
<a href="html_lektion_7.html">Lektion 7: Links</a>
Linket herover vil give flg. resultat: Når der klikkes på teksten "Lektion 7: Links" på websiden vil handlingen: href="html_lektion_7.html", blive udført. Hvilket betyder at "html_lektion_7.html" filen vil blive loadet ind i browser vinduet.
<a> tag'n kan modtage en række koder:
- href="" angiver hvilken handling der skal udføres ved klik på linket
- title="" giver linket en titel
- target="" giver dig mulighed for at fortælle hvor siden skal loades. Skrives f.eks. target="_blank" udføres handlingen i et nyt browser vindue. Skrives f.eks. target="_parent" udføres handlingen i samme browser vindue, men ikke inde i en frame. Bruges der ikke target= udføres handlingen samme sted som linket står.
Der er for såvidt ingen begrænsning på hvad du kan skrive imellem <a href=""> ..og.. </a>.
Farve og understregning af et link
Et tekst link eller et grafik link, hvor <img> tag'n ikke har border="0", vil have en farve, som du ikke kan styre med f.eks. <font> tag'n og hvis linket er et tekst link, vil teksten have en streg under teksten. Som default styres denne farve af koderne link="" (et link), alink="" (et aktivt link) og vlink="" (et tidligere besøgt link), som skrives i <body> tag'n.
Denne måde er ikke super fleksibel - vi vil derfor vise dig en anden måde at styre dette på. Tricket du får her er ikke HTML, men er derimod CSS. Teknikken er dog simpel:
Lad os sige at du ønsker et tekst link som skrives med rød tekst, og som ikke har en linie under teksten. Dette gør du ved at tilføje koden style="" i <a> tag'n. I style="" koden skriver du herefter en eller flere CSS erklæring(er). I dette tilfælde bruger vi CSS erklæringen color:#A03333; (rød farve) og CSS erklæringen text-decoration:none; (ingen understregning). Linket skal nu skrives f.eks. således:
<a href="html_lektion_7.html" style="color:#A03333;text-decoration:none;">Lektion 7: Links</a>
Andre typer links
i eksemplerne herover har alle links loadet en webside. Et link kan sagtens udføre andre handlinger, ved klik på linket.
Ønsker du at resultatet af linket skal være at en andens hjemmeside loades i et nyt browser vinue, kan det f.eks. gøres således (et hyperlink):
<a href="http://www.rgb.dk" target="_blank">www.rgb.dk</a>
Ønsker du at linket skal resultere i at en fil downloades (vi anbefaler at du altid laver én eller flere filer om til en ".zip" fil hvis det skal være download-bart).. kan det f.eks. gøres således:
<a href="mit_cv.zip">Download mit CV</a>
Du kan også få en brugers Email program til at åbne et "skriv og send Email" vindue vha. et link. Dette gøres således:
<a href="mailto:din@email.her">Send en Email til mig</a>
Skrevet okt. 2001 af Niels Rune Bøggild
| Tilføjet af Simon Glue den 02-12-2003 - Hits: 3783 |
   |