Tietotori – Osallistu ja vaikuta

Tietotori

03 Tekstin muotoilu

Tekstin muotoilu

WWW-sivujen ulkoasua voi piristää ilman kuviakin: muuttelemalla tekstin tyyliä. Tekstin tyylittelyillä vidaan korostaa tiettyjä sanoja, piristää eräitä tekstinpätkiä, ja selkiyttää pitkiä tekstejä.

Yleisimpiä tyylittelykomentoja ovat:
<B>             = Lihavointi
<I>             = Kursivointi
<U>             = Alleviivaus
<STRIKE>        = Yliviivaus
<BLINK> = Vilkutus

Kaikki tyylittelykomennot on lopetettava niiden sulkupareilla, esim:

<B>Lihavoitua teksti&auml;.</B>

Tekstiä voidaan muotoilla muillakin tavoilla. Voidaan muuttaa tekstin kokoa, väriä ja kirjasinta. Nämä muutokset tapahtuvat <FONT>-tageilla. Jos halutaan muuttaa tekstin kokoa, käytetään komentoa FONT SIZE:

<FONT SIZE="+3">Koko +3.</FONT>

Muutettaessa itse kirjasinta käytetään komentoa FONT FACE. Koska kaikilla käyttäjillä ei ole tietokoneissaan samoja kirjasimia, kannattaa käyttää FONT FACE-komentoa harkiten. Useimmista kotitietokoneista löytyvät esimerkiksi Geneva, Helvetica ja Arial. Alla esimerkki, joka käyttää tekstin esittämiseen ensisijaisesti kirjasinta Arial. Mikäli sitä ei käyttäjän koneesta löydy, käytetään Helveticaa, tai jos sitäkään ei löydy käytetään Genevaa (ja jos Genevaa ei löydy, käytetään selaimen oletuskirjasinta, joka on yleensä Times):

<FONT FACE="arial,helvetica,geneva">Teksti&auml;.</FONT>

Tekstin kirjasinkoon muuttamiselle on olemassa vaihtoehtoinen, otsikkojen muotoiluun käytettävä tekniikka, eli Heading-komennot. Niissä tekstille annetaan koko tagilla <H#>, jossa "#" on numero väliltä 1-6. Numero yksi on haarukan suurin ja kuusi pienin kirjasinkoko. Esimerkki:

<H6>Koko +3.</H6>

Tekstin väri muutetaan komennolla FONT COLOR. Sen arvoksi voidaan sijoittaa joko värin HEX-koodi tai jokin ennaltamääritellyistä värisanoista. Sanat ovat:
Black           = Musta
Gray            = Harmaa
Silver          = Vaaleanharmaa
White           = Valkoinen
Blue            = Sininen
Aqua            = Vaaleansininen
Navy            = Tummansininen
Red             = Punainen
Fuchsia = Fuchsia (Magenta)
Maroon  = Punaruskea
Purple          = Purppura
Yellow          = Keltainen
Green           = Vihreä
Lime            = Vaaleanvihreä
Teal            = Sinertävän vihreä
Olive           = Oliivi (kelta-vihreä)

Ylläolevat värit toimivat vanhimmillakin värinäytöillä, ja niiden määrittely on helpompaa kuin Heksakoodien käyttö.

Mikäli halutaan määritellä tekstille väri, koko ja kirjasin (tai koko ja kirjasin, väri ja kirjasin tai koko ja väri), sijoitetaan kaikki kirjasinkomennot yhden tagin sisään:

<FONT FACE="arial,helvetica,geneva" FONT SIZE="+2" FONT COLOR=BLUE>Teksti&auml;.</FONT>
Kyseisen rivin voi muotoilla myös lyhyempään muotoon:
<FONT FACE0"arial,helvetica,geneva" SIZE="+2" COLOR=BLUE>Teksti&auml;.</FONT>

Kuten ylläolevista esimerkeistä voidaan nähdä, kaikki kirjasinkomennot päättyvät tagiin </FONT>.

Mikäli halutaan rivinvaihto tiettyyn kohtaan tekstiä, käytetään tagia <BR>. Tämä komento siirtää seraavat tekstirivit automaattisesti alkamaan seuraavasta rivistä. <BR>-tagin käyttö ei ole pakollista, sillä selaimet osaavat katkaista tekstirivit niin että ne mahtuvat aina selaimen ikkunaan, ilman että käyttäjä joutuu rullaamaan selaimen ikkunaa vaakasuunnassa. Joskus taas saatetaan törmätä sanoihin tai merkkijonoihin joita ei haluta katkaista missään tapauksessa (esim. puhelinnumerot). Tällöin voidaan ympäröidä haluttu merkkijono <NOBR>- ja </NOBR>-tageilla.
Pitkä merkkijono, vaikkapa pitkä yhdyssana, voidaan määritellä katkaistavaksi mikäli sille on tarvetta tagilla <WBR>. Kaikki BR-komennot tulee lopettaa niiden sulkupareilla.

Uusi kappale aloitetaan tagilla <P>. Tämä siirtää tekstin edellisestä kappaleesta noin rivin verran alaspäin. <P>-tagi voidaan sulkea kappaleen lopuksi tagilla </P>, mutta sille ei yleensä ole tarvetta.


© Intelligent Systems, 1999