Riviväli CSS:ssä
Opitaan nyt asettamaan tekstille riviväli.
Rivivälillä tarkoitetaan tekstirivien välistä etäisyyttä,
eli valkoista tilaa niiden välillä.
Tätä varten on tarkoitettu ominaisuus line-height,
joka asettaa tekstirivin korkeuden.
Käytettäessä ominaisuutta line-height
saatat kohdata pienen yllätyksen: tämä ominaisuus
ei aseta väliä tekstirivien väliin,
kuten voisi luulla, vaan asettaa tekstirivin
korkeuden.
Tämä tarkoittaa, että todellinen näkyvä väli
rivien välillä lasketaan seuraavasti: line-height
- font-size = näkyvä etäisyys
tekstirivien välillä.
Seuraavassa esimerkissä tekstirivien välinen etäisyys
on 50px - 20px = 30px
<p>
some long text
</p>
p {
font-size: 20px;
line-height: 50px;
text-align: justify;
width: 400px;
}
:
Olkoon kappaleiden fontin koko 30px.
Aseta ominaisuus line-height siten,
että näkyvä valkoinen väli kappaleiden välillä
on 15px.
