Keskitystekstiä käytetään yleensä verkkosivuston tai asiakirjan otsikossa. Voit keskittää tekstiä HTML-koodilla käyttämällä
Yksi tapa keskittää tekstiä tai laittaa se sivun keskelle on sulkea se
<center>Center this text!</center>
Tämän tekstin lisääminen HTML-koodiin antaisi seuraavan tuloksen:
Keskitä tämä teksti!
Tunniste
Tyylisivuominaisuuden käyttäminen
Voit keskittää verkkosivuston tekstin CSS:llä määrittämällä keskitettävän elementin tekstin tasausominaisuuden.
Keskitetään muutama tekstilohko
Jos keskitettävää tekstiä on vain yksi tai muutama lohko, lisää style-attribuutti elementin avaustunnisteeseen ja käytä “text-align”-ominaisuutta. Alla olevassa esimerkissä olemme lisänneet ne
-tunnisteeseen.
<p style="text-align:center">Center this text!</p>
“text-align”-ominaisuus on asetettu arvoon “center” osoittamaan, että elementti on keskitetty sivun keskelle tai sisältää div.
Useita tekstilohkoja
Jos sinulla on useita keskitettävää tekstilohkoa, käytä CSS:ää
-tunnisteiden sisällä head-osassa tai ulkoisessa tyylisivussa. Katso alla olevasta esimerkkikoodista, kuinka kaikki
-tunnisteiden teksti asetetaan keskitettäväksi.
<style>
p {
text-align:center
}
</style>
Jokaisen
-tunnistesarjan teksti on keskitetty sivulle. Jos haluat, että jotkin kappaleet keskitetään, kun taas toiset eivät, voit luoda tyyliluokan alla olevan koodin mukaisesti.
<style>
.center {
text-align: center
}
</style>
Jos olet luomassa keskiluokkaa, kuten yllä olevassa esimerkissä näkyy, kappale voidaan keskittää alla olevalla koodilla, joka “kutsuu” keskiluokkaa.
<p class="center">Center this text!</p>
Kun luokka on luotu, sitä voidaan käyttää mihin tahansa HTML-tunnisteeseen, joka sisältää sanoja, kuvia ja useimpia muita elementtejä. Jos esimerkiksi haluat, että otsikko on keskitetty, voit lisätä class=”center”-tunnisteen
