Links i HTML

For at tilføje et link (eller hyperlink) til hjemmesiden kan man benytte tagget <a>. Et link kan klikkes på med musen for at tilgå en anden side på nettet. Denne side kan både være på den samme hjemmeside eller en helt anden. Et link kan bestå af flere forskellige elementer på hjemmesiden, bl.a. paragraffer, billeder, knapper og overskrifter. For at et link skal fungere skal det indholde attributten href, som specificerer hvorhenne linket skal føre til. Værdien af href-attributten er oftest en URL. Teksten mellem åbnings- og lukningstagget er den synlige del af linket på hjemmesiden som kan klikkes på.

Nedenstående er et eksempel på et link med teksten “Mere info om HTML” som linker til den side på Wikipedia som omhandler HTML:

<a href = "https://da.wikipedia.org/wiki/HTML"  target = "_blank">Mere info om HTML</a>

Attributten target angiver, hvordan linket skal åbnes. Standardværdien er _self som angiver at linket skal åbnes på samme side som man er på. Hvis linket skal åbnes i et nyt vindue så skal værdien sættes til at være lig _blank.

Ovenstående kodestykke vil resultere i nedenstående link, som man kan klikke på for at se, hvor det fører hen:

Mere info om HTML

Linket kan også tilføjes til et billede, en knap eller ethvert andet element på siden ved at putte <a> og </a> udenom element-tagget, ligesom i nedenstående eksempel, hvor den er sat udenom et billedelement:

<a href = "https://da.wikipedia.org/wiki/HTML">
  <img src = "filnavn.jpg">
</a>

Hvis man gerne vil skabe et link, som automatisk scroller hen til et specifikt punkt på den samme side som man er på, så skal man først finde det element, som skal scrolles hen til og angive dets id.

<p id = "punkt">Dette er et specifikt punkt på siden.</p>

Ovenstående element har fået id’et “punkt”. Hvis man skal linke til dette specifikke punkt på siden, så kan man angive id’et i href-værdien og tilføje et #-symbol foran, ligesom i nedenstående eksempel:

<a href = "#punkt">Link som fører hen til det specifikke punkt på siden.</a>

 

Gå videre til Lister i HTML her →