Slika nije samo umetnuta izravno u tekst. Pregledniku se kaže njegovo ime i upute gdje i kako ga postaviti na ekran. Da biste to učinili, koristite jednu HTML oznaku img. Određuje lokaciju grafičkog objekta na web stranici.
Ako su mnogi atributi neobavezni za oznake, tada oznaka img mora imati barem jedan parametar - adresu slike. Ovaj se atribut naziva src:
- - ovo će prikazati datoteku goat-j.webp" />
- - s ovim parametrom img oznake, preglednik će učitati sliku objavljenu na Internetu na web-mjestu megasellmag.ru.
Atributi poravnanja
Za pozicioniranje slika na stranici pomoću HTML-a koristi se oznaka img, čiji su atributi odgovorni za postavljanje slike na stranicu i prirodu njenog prelamanja teksta.
Prema zadanim postavkama, preglednik postavlja sliku u središte zaslona, a tekst se ne omota oko nje. Oznaka img omogućit će vam da izrazite svoje neslaganje s preglednikom pomoću atributa align (alignment).
- slika će biti pozicionirana na lijevom rubu stranice, a tekst će je zaobilaziti s desne strane.
Ponašanje teksta bit će slično ako je slika postavljena s desne strane (align=desno), u sredini (align=middle), gore (align=top), dolje(poravnati=dno) i središte (središte).
Postavke i veličine
Kako bi se spriječilo da se tekst uvuče u slike, oznaka img je dobila posebne atribute -hspace (vodoravne/vodoravne margine) i vspace (vertikalne/vertikalne margine), koji određuju količinu uvlačenja teksta od rubova slika u piksela.
Slika ne samo da će se poslušno odmaknuti od teksta za navedeni iznos, već će se i odmaknuti od ruba stranice, stoga je najbolje izbjegavati velike uvlake.
Veoma su bitne geometrijske dimenzije slika, koje su ne samo poželjne, već ponekad jednostavno potrebno odrediti za ispravan prikaz slike. Za to se koriste atributi width (width) i height (height) čija je vrijednost postavljena u pikselima ili postocima.
Ako navedete samo širinu, visina će se automatski odabrati s izvornim proporcijama. Postotne veličine omogućuju vam da postavite sliku u desni dio stranice, bez obzira na veličinu prozora preglednika, a ta se potreba često javlja.
Druge opcije
Atribut border zatvara sliku u okvir određene debljine, što preglednik ne radi prema zadanim postavkama.
Obrub također može imati naizgled besmislenu nultu širinu (border='0'), ali to je sve dok slika ne postane veza, kada je preglednik automatski zaokruži plavim obrubom bez čekanja na upute.
Neki nestrpljivi korisnici, bijesni zbog niskih brzina interneta, jednostavno će onemogućiti prikaz slika. Za takve slučajeve predviđen je parametar alt koji vam omogućuje ulazak alternativni tekst koji će korisnik vidjeti u okviru u kojem se slika žuri učitati.
Ako vam se ne sviđaju mogućnosti alt parametra, oznaka img može ponuditi longdesc atribut, čija je vrijednost URL dokumenta s detaljnijim opisom.
Atributi usemap i ismap govore pregledniku da će slika biti slika u kojoj su hiperveze odvojena područja (link mapa), samo parametar usemap određuje navigacijsku kartu na poslužitelju, a ismap - kartu na strana klijenta.
Opis veze 1 na donjoj slici:
Egzotični artikli
Lowsrc atribut upućuje pregledniku da prvo preuzme kopiju (ili drugu alternativu) izvorne slike niže kvalitete i, prema tome, "lakše". Ovaj trik je predviđen u slučaju male brzine interneta za korisnika. Originalna slika, kada se prenese, zamjenjuje "lažnu".
Rjeđe korišteni atribut galleryimg oznake img poziva upravljačku ploču slike (kada se zadržite iznad), omogućujući vam da otvorite zadanu mapu Moje slike i ispišete, spremite ili pošaljete sliku e-poštom. Panel možete onemogućiti postavljanjem parametra galleryimg na no/false i omogućiti ga postavljanjem da/true.
U novoj HTML5 specifikaciji, određeni broj oznaka ima zastarjele parametre. Na primjer, lowsrc, border, longdesc i name atributi img su povučeni.
