Lägga till bilder i HTML
Svep för att visa menyn
Bilder gör webbsidor mer engagerande. Du kan infoga en bild med hjälp av <img>-taggen.
index.html
Viktiga attribut:
src: obligatorisk. Sökväg till bildfilen (absolut eller relativ);alt: obligatorisk. Text som visas om bilden inte kan laddas, används även av skärmläsare;width/height: storlek i pixlar. Utan dessa visas bilden i sin ursprungliga storlek.
alt-attribut
alt-texten bör tydligt beskriva bilden och ge användbar kontext.
Föreställ dig följande exempel. Du har en källa om hästkapplöpning. Du vill visa hur deltagarna förbereder sig inför loppet.
Dålig alt-text:
index.html
Bättre alt-text:
index.html
Den förbättrade versionen ger verklig kontext och hjälper synskadade användare att förstå vad bilden visar.
src-attribut
Attributet src kan använda både absoluta och relativa sökvägar för att ange platsen för bildfilen.
Absolut sökväg
En fullständig URL som pekar på en bild online.
index.html
Vem som helst kan komma åt bilden via denna fullständiga länk.
Vänligen granska följande verkliga exempel.
Relativ sökväg
Pekar på en bild i din projektmapp.
index.html
Detta innebär att image.jpg är lagrad i images-katalogen nära din HTML-fil.
Undersök det verkliga exemplet nedan. Du hittar mappen images, som innehåller filen sun.png.
Absoluta sökvägar: fullständiga webbadresser som fungerar var som helst på internet.
Relativa sökvägar: lokala projektsökvägar som används inom din egen mappstruktur.
1. Vilken tagg kan användas för att lägga in en bild på en webbplats?
2. Vilket attribut måste anges för en <img/>-tagg?
Tack för dina kommentarer!
Fråga AI
Fråga AI
Fråga vad du vill eller prova någon av de föreslagna frågorna för att starta vårt samtal