O slikama:
JPEG koristite za fotografije. Prikazuje do 16 miliona boja. Ne podržava transparentnost (providnost).
GIF je najbolji za slike sa malim brojem boja, linijama kao npr. logo-i, klip-art, mali tekst u slikama. Podržava do 256 boja. Dozvoljava da jedna boja pozadine bude transparentna (providna), tako da se sve što je ispod slike može videti.
PNG poseduje napredne opcije za providnost.
Resize & Thumbnail:
Da promenite širinu / visinu slike, otvorite je u Microsoft Paint-u, "Resize and Skew" opcija, izaberite Pixels i ukucajte nove vrednosti. Ako je "Maintain aspect ratio" štiklirano, slika zadržava prvobitnu razmeru.
Sad možemo da napravimo da mala slika (thumbnail) linkuje ka velikoj. Tako ne moramo da držimo veliku sliku i zauzimamo prostor na strani. Kome treba da bolje vidi, samo neka klikne. Uobičajena je praksa da se velika slika otvara u novom tab-u.
<p><a href="../images/Superman_Shield.jpg" target="_blank" title="Kada kliknete na ovu malu sliku (thumbnail), u novom prozoru će se otvoriti velika (originalna) slika"><img src="../thumbnails/Superman_Shield_thumb.jpg" alt="S-logo thumbnail" /><a></p>
U knjizi prave čitav novi HTML kad hoće da linkuju thumbnail ka velikoj slici. Može i to, ako baš hoćete neki kontekst: da napišete naslov ili da dodate tekst ispod slike, promenite boju pozadine, itd.
<p><a href="Superman.html" target="_blank" title="Ovaj put link vodi ka HTML-u na kome se nalazi slika sa propratnim tekstom"><img src="../thumbnails/Superman_Shield_thumb.jpg" alt="S-logo thumbnail" /></a></p>
<img /> uokviren:
Obratite pažnju na to da je <img> INLINE element, što znači da MORA biti u nekom BLOCK elementu. Naravno, više slika može biti u istom BLOCK elementu, ili svaka posebno u svom. Npr. evo tri slike koje se sve nalaze u jednom <p> elementu:
A sada, evo tri slike koje su svaka u svom zasebnom <p> elementu:
Veoma je važno razumeti razliku, zato ću još jednom ponoviti rečenice iz Poglavlja 3:
BLOCK elementi su uvek prikazani kao da imaju prazan red ispred i iza sebe i po defaultu zauzimaju PUNU širinu strane.
INLINE elementi se uvek prikazuju u zamišljenoj liniji koja "teče" u pravcu texta - sleva na desno.