Tekstin muotoilu

HTML:ssä tekstiä voidaan muotoilla erilaisilla tageilla. Useimmiten saman asian voi hoitaa myös CSS:llä ja tällöin oppaassa on myös linkki oikeeseen kohtaan. Kannattaa kaikki mahdollinen muotoilu tehdä CSS:llä.

Tekstin lihavoiminen

Tekstistä voidaan tehdä lihavoitua STRONG-tagilla. Järkevämpää on kuitenkin käyttää CSS:än FONT WEIGHT-attribuuttia.

<strong>Tämä teksti on lihavoitua.</strong>

Tämä teksti on lihavoitua.

Tekstin kursivoiminen

Tekstistä voidaan tehdä kursivoitua I-tagilla. Järkevämpää on kuitenkin käyttää CSS:än FONT-STYLE-attribuuttia.

<i>Tämä teksti on kursivoitua.</i>

Tämä teksti on kursivoitua.

FONT-tagi

HTML:ssä tekstiä voidaan muuttaa FONT-tagilla. Tagin sisään tulee tarvittavat attribuutin ja niiden arvot. Teksti tulee tagin aloitus- ja lopetustagien sisään.

Järkevämpää on kuitenkin käyttää CSS:ää tekstin muotoilemiseen ja FONT-tagin sijaan SPAN-tagia. HTML 4.0.1 String:ssä (ja XHTML:ssä) FONT-tagi ei ole enään sallittu.

<font></font>

Tekstin koko

Tekstin kokoa voidaan muuttaa SIZE-attribuutilla. Attribuutti laitetaan FONT-tagiin. Arvo voidaan antaa absoluuttisina arvoina; NUMEROINA ja PIKSELEINÄ (PX), tai voidaan käyttää suhteellisiä arvoja; EM ja EX.

Pikseleinä kerrottaessa tekstin koko määräytyy nimensä mukaisesti näytön kuvapisteiden mukaan. EM-arvolla kerrottaessa koko määräytyy käytettävän kirjasimen M kirjaimen koon mukaan (1em on kirjasimen M kirjaimen koko). EX-arvo on muuten sama kuin EM, mutta koko määräytyy kirjasimen X kirjaimen mukaan.

Järkevämpää on kuitenkin käyttää CSS:än font-size määritettä ja FONT-tagin tilalla SPAN-tagia.

<font size="arvo"></font>
<font size="20px">Tämän tekstin koko on 20px</font>

Tämän tekstin koko on 20px

<font size="1.5em">Tämän tekstin koko on 1.5em</font>

Tämän tekstin koko on 1.5em

<font size="2ex">Tämän tekstin koko on 2ex</font>

Tämän tekstin koko on 2ex

Kirjasintyyppi (fontti)

Tekstin fonttia voidaan vaihtaa FONT-tagin FACE-attribuutilla. Attribuutin arvoksi annetaan halutun fontin nimi. Jos halutaan määritellä useampi fontti, niin fontit erotetaan toisistaan pilkulla. Tällöin jos ensimmäistä fonttia ei löydy, niin käytetään seuraavaa.

HTML 4.0.1 String:ssä font-tagi on poistettu (joskin nykyaikaiset selaimet sen kyllä ymmärtävät), joten järkevämpää onkin käyttää CSS:än FONT-FAMILY määritettä ja FONT-tagin tilalla SPAN-tagia.

<font face="kirjasin"></font>
<font face="sans-serif">Tämä fontti on Sans-serif</font>

Tämä fontti on Sans-serif

Tekstin viivaukset

Tekstiä voidaan alleviivata sekä yliviivata. Alleviivaus tehdään U-tagilla ja yliviivaus STRIKE-tagilla. Järkevämpää on kuitenkin käyttää CSS:än TEXT-DECORATION määritettä.

<u></u>
<strike></strike>
<u>Tämä teksti on alleviivattua.</u>
<strike>Tämä teksti on yliviivattua.</strike>

Tämä teksti on alleviivattua.

Tämä teksti on yliviivattua.

Indeksit

Tekstiä voidaan muuttaa yläindeksiin SUP-, tai alaindeksiin SUB-tageilla.

<sup></sup>
<sub></sub>
Suhteellisuusteorian mukaan E=mc<sup>2</sup>
Veden kemiallinen yhdiste on H<sub>2</sub>O

Suhteellisuusteorian mukaan E=mc2

Veden kemiallinen yhdiste on H2O

<< Värit Edellinen osa || Seuraava osa Kuvat >>