![...](/f/64bb97101aa368f321f57ef99b6d7abc.jpg)
Kasutage veebilehe välimuse määramiseks CSS-i.
Veebilehe kodeerija kasutab hüperteksti märgistuskeelt, et öelda veebibrauserile lehe iga elemendi (nt lõigu, pealkirja või loendi) funktsionaalset eesmärki. Alates HTML 4-st on Cascading Style Sheets andnud kodeerijale võimaluse öelda brauserile, kuidas need elemendid peaksid välja nägema, eraldi nende määratlemisest. Lehel võib olla erinevat tüüpi seadmete (nt mobiiltelefonide ja lauaarvutite) jaoks erinev CSS-stiil, mis võimaldab lehe välimust muuta, ilma et kodeerija peaks HTML-i muutma. Kasutage pildi tsentreerimiseks CSS-i atribuute.
Samm 1
Asetage HTML-faili märgend "img", kuhu soovite oma pilti veebilehel kuvada. See peab asuma siltide "body" vahel ja siltide "h1" järel. Näiteks,
Päeva video
See on teie tekst.
![Pildi kirjeldus](photo.jpg)
määrab pildi nimega photo.jpg, mis on 170 pikslit lai ja 50 pikslit pikk. See on esimene asi lehel pärast ülemist pealkirja.
2. samm
Kasutage leheelementide (nt piltide) ümber oleva ruumi määratlemiseks CSS-i atribuuti "margin". Veerise atribuudi väärtus "auto" käsib veebibrauseril ruumi suuruse automaatselt määrata. Niisiis,
![Pildi kirjeldus](photo.jpg)
3. samm
Kasutage atribuuti "kuva", et määrata, kuidas lehe elementi kuvatakse. Kuvaatribuudi väärtus "block" käsib veebibrauseril kuvada elementi oma real, mille kohal ja all on tühik. Niisiis, defineerib sama pildi, kuid lisab "display: block;" asetab selle nüüd omale reale.
4. samm
Vaadake veebilehte mitmes erinevas brauseris, et kontrollida, kas pilt on õigesti keskel.
Näpunäide
Lisage pildi kirjeldus "alt" märgendisse. See muudab teie lehe nägemispuudega lugejatele paremini juurdepääsetavaks ja tagab, et teie kood vastab standarditele.