In deze tutorial gaan we het hebben over hoe we tekst kunnen opmaken met CSS eigenschappen. De meeste eigenschappen vind je terug op deze pagina. Nog niet alle eigenschappen i.v.m. tekst zijn in deze tutorial vermeld.
1. Color (kleur van de tekst)
Er zijn drie methodes om tekst te kleuren in CSS. Bij de eerste methode schrijf je de kleur voluit (vb: red, black, green,...). Het nadeel van deze methode is dat je maar een beperkt aantal kleuren tot beschikking hebt.
<STYLE TYPE="text/css">
P {color: red}
</STYLE>
Resultaat:
Deze tekst is rood.
Bij de volgende methode
vul je de hexadecimale code in van de kleur (vb: #000000, #FFFFFF, #FF0000, ...). Het voordeel van deze methode is dat je mar liefst 16.777.216 verschillende kleuren kunt gebruiken. Deze methode wordt ook het meeste gebruikt..
<STYLE TYPE="text/css">
P {color: #FF0000}
</STYLE>
Resultaat:
Deze tekst is rood.
De derde methode is ongeveer dezelfde als de tweede methode, alleen vul je hier niet de hexadecimale code in maar de RGB code. (rood groen
blauw). Het kleinst mogelijke waarde is 0, het grootst mogelijk is 255.
<STYLE TYPE="text/css">
P {color: RGB(255,0,0)}
</STYLE>
Resultaat:
Deze tekst is rood.
top 2. Font-size (grootte van de tekst)
Met "font-size" kunnen we de grootte van het lettertype bepalen. Ook bij dit eigenschap zijn er drie verschillende manieren om de grootte van het lettertype te bepalen. De eerste methode werkt met "X aantal %". 100% is de standaard grootte.
<STYLE TYPE="text/css">
P {font-size: 150%}
</STYLE>
Resultaat:
Deze tekst is 150%
De tweede methode werkt met "X aantal pt (points)". Vele programma's zoals "Microsoft Word" werkt met pt.
Een voorbeeldje met points:
<STYLE TYPE="text/css">
P {font-size: 15pt}
</STYLE>
Resultaat:
Deze tekst is 15 points.
De derde methode werkt
met "X aantal px (pixels)".
<STYLE TYPE="text/css">
P {font-size: 20px}
</STYLE>
Resultaat:
Deze tekst is 20 pixels.
top 3. Font-family (soort lettertype)
Met het eigenschap "font-family" kunnen we het lettertype veranderen in CSS.
top 4. Font-style (stijl van de tekst)
Met het
eigenschap "font-style" kunnen we de stijl veranderen in CSS. Verschillende mogelijkheden zijn normal, italic en oblique.
top 5. Font-weight (dikte van de tekst)
Met het
eigenschap "font-weight" kunnen we de dikte veranderen in CSS. Dit kan op twee verschillende methodes gedaan worden. Bij de eerste methode kun je deze waardes gebruiken: (normal, bold, bolder, lighter).
top 6. Text-transform (uppercase/capitalize/lowercase)
Met "text-transform" kun je de tekst transformeren naar allemaal hoofdletters (uppercase) of kleine letters (lowercase) met CSS. Het is ook mogelijk om van de eerste letter van een woord een hoofdletter te maken (capitalize).
Wat is jouw favoriete javascript framework? (S: 18, R: 2)
(4.53) 
