Käytä CSS: ää määrittääksesi Web-sivun ulkoasun.
Web-sivun koodaaja käyttää Hypertext Markup Language -kieltä kertomaan selaimelle sivun jokaisen elementin, kuten kappaleen, otsikon tai luettelon, toiminnallisen tarkoituksen. HTML 4:stä lähtien Cascading Style Sheets on tarjonnut koodaajalle tavan kertoa selaimelle, miltä kunkin elementin pitäisi näyttää, erillään niiden määrittelystä. Sivulla voi olla erilaisia CSS-tyylejä erityyppisille laitteille, kuten matkapuhelimille ja pöytätietokoneille, jolloin sivun ulkoasu voi muuttua ilman, että koodaajan tarvitsee muuttaa HTML-koodia. Käytä CSS-ominaisuuksia kuvan keskittämiseen.
Vaihe 1
Aseta "img"-tunniste HTML-tiedostoon kohtaan, johon haluat kuvan näkyvän Web-sivulla. Sen on oltava "body"-tunnisteiden välissä ja "h1"-tunnisteiden jälkeen. Esimerkiksi,
Päivän video
Tämä on sinun tekstisi.
määrittää kuvan nimeltä photo.jpg, joka on 170 pikseliä leveä ja 50 pikseliä korkea. Se on ensimmäinen asia sivulla yläotsikon jälkeen.
Vaihe 2
Käytä "marginaali" CSS-attribuuttia määrittääksesi tilan sivuelementtien, kuten kuvien, ympärille. Marginaaliattribuutin "auto"-arvo kertoo verkkoselaimen määrittämään automaattisesti tilan määrän. Niin,
määrittää, että selain määrittää kuvan ympärillä olevan tilan.Vaihe 3
Käytä "näyttö"-ominaisuutta määrittääksesi, miten sivuelementti näytetään. Näyttöominaisuuden "block"-arvo käskee web-selainta näyttämään elementin omalla rivillään siten, että sen ylä- ja alapuolella on tilaa. Niin, määrittää saman kuvan, mutta lisäys "display: block;" asettaa sen nyt omalle rivilleen.
Vaihe 4
Tarkastele Web-sivua useilla eri selaimilla varmistaaksesi, että kuva on keskitetty oikein.
Kärki
Sisällytä kuvan kuvaus "alt"-tunnisteeseen. Tämä tekee sivustasi helpommin näkövammaisten lukijoiden saatavilla ja varmistaa, että koodisi on standardien mukainen.