Brug af billeder i HTML involverer tre hovedtrin:
1. Billedfil:
- Forbered din billedfil i et passende format, såsom JPEG, PNG eller GIF.
- Gem det med et beskrivende navn. For eksempel "image-name.jpg".
2. Billedmappe:
- Opret en mappe på din computer til at gemme dine billeder.
- Placer den billedfil, du vil bruge, i denne mappe.
3. HTML-kode:
- Åbn din HTML-fil i en teksteditor eller HTML-editor.
- I den relevante sektion af din HTML-kode, typisk "
", skal du tilføje følgende kode:
```html
```
- Erstat "path_to_image" med den faktiske sti til din billedfil. Hvis dit billede f.eks. hedder "image-name.jpg" og er placeret i mappen "images" i samme mappe som din HTML-fil, vil stien være:
```html
src="images/image-name.jpg"
```
- Erstat "alternativ_tekst" med en kort beskrivelse af billedet. Denne tekst vil blive vist, hvis billedet af en eller anden grund ikke kan vises, såsom et ødelagt link eller en brugers deaktiverede billedindlæsningsindstillinger.
Her er et eksempel på et komplet kodestykke:
```html
Overskrift
Tekstindhold...
```
Gem din HTML-fil, og åbn den i en webbrowser for at se det indsatte billede.
Yderligere attributter for `
` Tag:
- "width" og "height" attributter:Angiv den ønskede bredde og højde af billedet i pixels.
- "align" attribut:Styrer den vandrette justering af billedet. Værdier inkluderer "venstre", "højre" og "center".
- `title`-attribut:Tilføjer en værktøjstip-tekst, der vises, når du holder musen over billedet.
Note:
Det er en god praksis at optimere dine billeder til webydeevne ved at komprimere dem uden at ofre den visuelle kvalitet.