Sisältö

• ohjeet
• Tekstin kohdistaminen
• vasemmalle {
• oikea {
• keskusta {
• Miten keskittää divisioonat, ääriviivat ja kehon jakaumat
• vihjeitä
• Mitä tarvitset

Sen sijaan, että käytät tekstin merkitsevien HTML-tunnisteiden sisältämiä HTML-kohdistusominaisuuksia, web-suunnittelijoiden on parempi siirtää esitystietoja (kohdistusasetukset) tyylisivulle. Tässä artikkelissa kerrotaan, miten tekstiä kohdennetaan ja miten keskitetään suurempia sivuelementtejä, kuten osioita.

ohjeet

Tyyli-arkkien avulla voit kohdistaa ja keskittää enemmän kuin tekstiä (verkkosivujen ulkoasukuva: 6922Designer, Fotolia.com)

Tekstin kohdistaminen

1. Jos haluat kohdistaa tekstiä normaaliin tekstilohkoon, kuten kappaleeseen tai viittaukseen, käytä tekstin kohdistusominaisuutta.

2. Tekstin kohdistusominaisuuden arvovaihtoehdot ovat vasemmalla, oikealla, keskellä ja oikeuttavat. Koska perusteltu teksti ei ole helposti luettavissa Webissä, kuvassa näkyy vain vasen, oikea ja keskipiste. Tässä kuviossa jokaisella kappaleella on musta reunus, joka osoittaa sivun lohkoelementin koon, jos leveyden säätöä ei sovelleta elementtiin.

3. Tyypillisesti elementti osoitetaan tunnukselle tai luokalle. Tekstin kohdistaminen tämän tunnuksen tai luokan kaikkiin kohteisiin määritellään säännöllä, kuten seuraavilla:

   
   

   vasemmalle {

   tekstin kohdistus: vasen; }

   oikea {

   text-align: oikea; }

   keskusta {

   text-align: center; }

Miten keskittää divisioonat, ääriviivat ja kehon jakaumat

1. Saatat haluta keskittää koko ulkoasun tai suuren asettelun. Näissä tapauksissa käytetään eri CSS-tekniikkaa.

2. Voit käyttää CSS-sääntöä sen suurimman elementin valitsimeen, jonka haluat keskittää. Se voi olla runkoelementti, rajajako tai konttijako.

3. Keskittäminen tällä menetelmällä ei vaikuta tekstin kohdistukseen. Keskitetty elementti säilyttää tekstin oletetun vasemman kohdistuksen keskitetyssä elementissä.

4. Seuraavassa on esimerkki koko kehon elementistä (jossa on musta raja selkeyden vuoksi), joka on keskitetty sivulle. Elementille on asetettava leveys, sitten vasen ja oikea marginaali asetetaan automaattisesti. Tämä tapahtuu seuraavasti:

   
   

   runko {leveys: 80%; marginaali-oikea: auto; margin-left: auto; raja: 1kpl kiinteä musta; }

vihjeitä

• Normaalisti sinun ei tarvitse käyttää kohdistusta vasemmalle, koska vasen kohdistaminen on oletusarvo.Sinun täytyy kuitenkin olla tietoinen siitä, että se on olemassa, jos sinun on määriteltävä aiemmin keskitetty tai oikeanpuoleinen teksti oletuksena myöhemmin. Keskitetyn elementin leveys voidaan määrittää pikseleinä, prosentteina tai ems.

Mitä tarvitset

• Tekstieditori
• HTML-editori
• HTML-perusosaaminen