Kako centrirati sliku pomoću HTML programiranja

click fraud protection
...

Koristite CSS za određivanje izgleda web stranice.

Koder web stranice koristi jezik za označavanje hiperteksta kako bi web-pregledniku rekao funkcionalnu svrhu svakog elementa na stranici, kao što je odlomak, naslov ili popis. Od HTML 4, Cascading Style Sheets omogućili su koderu način da pregledniku kaže kako bi svaki od tih elemenata trebao izgledati, odvojeno od definiranja što su. Stranica može imati različite CSS stilove za različite vrste uređaja, kao što su mobilni telefoni i stolna računala, što omogućuje promjenu izgleda stranice bez da programer mora mijenjati HTML. Koristite CSS svojstva za centriranje slike.

Korak 1

Postavite oznaku "img" u HTML datoteku gdje želite da se vaša slika prikazuje na web stranici. Mora biti između oznaka "tijelo" i iza oznaka "h1". Na primjer,

Video dana

Ovo je tvoj tekst.

Opis slike

definira sliku pod nazivom photo.jpg koja je široka 170 piksela i visoka 50 piksela. To je prva stvar na stranici nakon gornjeg naslova.

Korak 2

Koristite CSS atribut "margin" za definiranje prostora oko elemenata stranice, kao što su slike. Vrijednost "auto" za atribut margina govori web-pregledniku da automatski odredi količinu prostora. Tako,

Opis slike definira da prostor oko slike određuje preglednik.

Korak 3

Upotrijebite svojstvo "prikaz" da definirate kako se element stranice prikazuje. Vrijednost "bloka" za svojstvo prikaza govori web-pregledniku da prikaže element u vlastitom retku, s prostorom iznad i ispod njega. Tako, Opis slike definira istu sliku, ali dodatak "display: block;" sada ga stavlja na svoju liniju.

4. korak

Pregledajte web stranicu u nekoliko različitih preglednika kako biste provjerili je li slika pravilno centrirana.

Savjet

Uključite opis slike unutar oznake "alt". To čini vašu stranicu pristupačnijom čitateljima s oštećenjem vida i osigurava da je vaš kôd usklađen sa standardima. Opis slike