Kako bi prikazali sliku na zaslonu potrebno je unutar html elementa <img>, dodijeliti vrijednost svojstvima src i alt. Vrijednost svojstva src je URL slike koju želimo prikazati.
Zašto ne sada?
Element umetanja slike <img /> je prazan element što znači da nema završne oznake elementa.
Kako bi prikazali sliku na zaslonu potrebno je dodijeliti vrijednost svojstvu src. Src je kratica od engleske riječi source (izvor). Vrijednost svojstva src je URL slike koju želimo prikazati.
Sintaksa umetanja slike u html dokument:
<img src="URL" alt="tekst" />
URL (Uniforme Resource Location) pokazuje mjesto gdje je slika pohranjena. Slika imena krajolik.jpg koja se nalazi u direktoriju slike na domeni www.mojwebdizajn.net ima URL:
https://www.mojwebdizajn.net/slike/krajolik.jpg
Svojstvo alt obavezno treba umetnuti. Služi dodjeljivanju vrijednosti zamjenskog teksta za sliku ako slika ne može biti prikazana. Razlog ne prikazivanju slike može biti pogrješka src svojstva ili kada korisnik koristi čitač zaslona. Ovo je posebno značajno za osobe s posebnim potrebama.
Primjer dodavanja alt svojstva:
<img src="krajolik.jpg" alt="Zimski krajolik" />
Svojstva slike height i width služe određivanju visine i širine slike na zaslonu.
Vrijednosti svojstva unosimo u pikselima ili postotcima veličine izvorne slike.
Primjer korištenja svojstava height i width:
<img src="papiga.jpg" alt="Papiga arara" width="320" height="180" />
U slučaju da ne navedemo obadva svojstva preglednik ne će znati veličinu slike. Učinak je da će se raspored web stranice tijekom učitavanja mijenjati.