HTML-kode billede med link

Når man er begynder indenfor HTML og CSS og laver en hjemmeside, så vil man ret hurtigt opdage et behov for at indsætte et billede med link i sin HTML-kode. Det heldigvis ganske nemt, men som ny kan det godt være lidt svært at gennemskue, så her kan du få HTML-kode til billede med link.

HTML billede

Først skal du kender et HTML billede element. Det ser således ud:

<img src="/mit-billede-url.jpg" alt="beskriv billedet kort">

HTML link

Dernæst skal du kende et HTML link tag. Der ser således ud:

<a href="https://miturl.dk/">Klik her</a>

Indsæt link i billede

Når så du gerne vil have at linket ligger i billedet, så er det ganske simpelt at opnå. Alt du skal gøre er at placere img-tagget inde i a-tagget, så det erstatter det stykke hvor du normalt har linkteksten også kaldet ankerteksten. I mit eksempel herover vil det være “Klik her” der skal erstattes med billede-tagget.

Sådan vil det se ud når det er udført rigtigt:

<a href="https://miturl.dk/"><img src="/mit-billede-url.jpg" alt="beskriv billedet kort"></a>

Du er velkommen til at kopiere koden og indsætte på dit eget site.

Uanset om du indsætter et link i et billede på en HTML side du byger med HTML kode fra bunden eller om du gør det i WordPress, Wix el. andre hjemmesideprogrammer, så er det samme kode der ligger bagved.

En kommentar til “HTML-kode billede med link”

Skriv en kommentar