Osnove HTML
Slike

Spoznali bomo...

[Vstavimo sliko na našo stran][Kaj to pomeni][Formati slik] [Kje naj dobim slike][Aktiviranje slike] Naučili smo se pisati besedila, ki jih lahko objavimo na spletnih straneh. Sedaj se bomo naučili še vstavljanja preprostih slik, takoimenovanih ikon. Uporabimo jih lahko kot slikovne povezave (linke) na druge strani.

Vstavimo sliko na našo stran

Za vstavljanje neke slike na dano lokacijo v našem besedilu uporabimo naslednji ukaz: <IMG SRC="slika.gif"> V naslednjem primeru smo uporabili sliko z imenom "homepage.gif" in dobili ....

Kaj to pomeni?

IMG pomeni "image" (slika). Tako napovemo, da na tem mestu želimo sliko.
SRC pomenir "source" (vir). Tako povemo brkljalniku, kje bo našel zahtevano sliko. Najbolj preprosto je, če se slika nahaja v istem direktoriju, kot naša HTML stran.
image.gif je ime naše slike oziroma ustrezne datoteke, ki to sliko vsebuje.

Formati slik

Naštejmo osnovne formate slik, kakršne zasledimo na spletnih straneh. Vsdak tip spozna brkljalnik po ustreznem podaljšku datoteke:

.gif pomeni Graphics Interchange Format. Ta format je na spletnih straneh najbolj popularen Je zelo,preprost, ker ga v bistvu sestavlja zaporedje barvnih pikic, pikslov.
.jpeg ali .jpg pomeni Joint Photographic Equipment Group. To je zgoščen zapis slike, ki terja precej manj spomina. Dostikrat z njim pomnimo fotografije in podobne komplicirane slike.
.bmp pomeni "bitmap" . Ta format redkeje uporabljamo.

Kje naj dobim slike?

Na spletnih straneh jih je vse polno in da se jih preprosto skopirati na lokalni računalnik. Vendar bi morali praviloma avtorja take spletne strani oziroma uporabljene slike prositi za dovoljenje.

Aktiviranje slike

SEdaj želimo tako sličico oziroma ikono uporabiti kot hipertekstno povezavo. S klikom na sliko naj bi preskočili na neko drugo stran. Format ukaza, ki ga zato potrebujemo, je naslednji: <A HREF="index.html"><IMG SRC="homepage.gif"></A> Kaj smo pravzaprav naredili? Preprosto, sliko smo vstavili tja, kjer smo prej pri definiciji povezave imeli tekst Preizkusimo, če stvar deluje:

Lepo! Vendar nas moti tisti modri okvir okoli slike. Dobili smo ga zato, ker je slika sedaj aktivna (link). Pri kliku na sliko tudi spremeni barvo, tako kot to velja va tekstovne povezave. Ne, tega okvirja nočemo! Odstranimo ga tako, da v ukaz o vstavljeni sliki dodamo še nekaj, kar pove, da naj bo rob slike enak 0: <IMG BORDER="0" SRC="homepage.gif">