Slike su važan dio web stranice. Kada ih želimo umetnuti koristimo html element img. Svojstvu src dodjeljujemo naziv i putanju slike koju želimo prikazati.
Zašto ne sada?
CDN pohrana slika i videa.
Pretvorba formata slika: webp...
Vrhunsko AI povećanje slika!
25Gb podataka.
Zašto ne sada?
Slike su važan dio web stranice. Kada ih želimo umetnuti koristimo html element <img />. Ovaj element sam za sebe nema nikakvu funkciju bez dodatnog svojstva src. Svojstvu src dodjeljujemo adresu slike koja će biti prikazati na zaslonu.
U sljedećim primjerima koristit ćemo sliku mojwebdizajn.jpg. Možete je preuzeti na donjoj poveznici.
Slijedi primjer web stranice s umetnutom slikom mojwebdizajn.jpg koja se nalazi u istoj mapi kao i html datoteka. Ispod slike se nalazi tekst.
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>HTML slika u istoj mapi</title>
</head>
<body>
<img src="mojwebdizajn.jpg" alt="Moj web dizajn" />
<p>Umetnuta slika naziva webdizajn.jpg</p>
</body>
</html>
Mjesta gdje se može nalaziti slika:
U istoj mapi gdje se nalazi i html dokument
Na istom računalu u drugoj mapi
Bilo gdje na internetu
Imamo li web sjedište sa većim brojem web stranica preporučljivo je slike organizirati po mapama. Dakle najmanje jedna mapa. Napravimo li mapu slike u mapi gdje se nalazi html dokument i premjestimo sliku mojwebdizajn.jpg u tu mapu, tada bi gornji primjer izgledao ovako:
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>HTML slika u drugoj mapi</title>
</head>
<body>
<img src="slike/mojwebdizajn.jpg" alt="Moj web dizajn" />
<p>Umetnuta slika se nalazi u mapi slike</p>
</body>
</html>
Treći slučaj ja kada se slika nalazi bilo gdje na Internetu. Tada moramo navesti cijelu URL putanju do slike npr.
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
</head>
<body>
<img src="https://www.mojwebdizajn.net/mojwebdizajn.jpg" alt="Moj web dizajn" />
<p>Slika se nalazi u korijenskom direktoriju</p>
<p>na web adresi https://www.mojwebdizajn.net</p>
</body>
</html>