Lettertypes

Bij lettertypes gebruiken de meeste mensen <font>. Dit is ook de makkelijkste. Ik raad wel aan om de font-tag te vermijden! Op deze website zul je ook af en toe een font-tag vinden, het is niet erg om er af en toe ééen te gebruiken maar houd wel in je achterhoofd dat in de volgende versies van HTML het in de planning ligt om de font-tag te verwijderen van de standaard functies van HTML. Je zou styles moeten gebruiken in plaats van font. De font komt in een volgende versie van HTML en XHTML terug maar dan met een andere functie.

De <font>tag gebruik je zo:

<p>
<font size="2" face="Verdana">
Dit is een paragraaf, geschreven in Verdana.
</font>
</p>
<p>
<font size="3" face="Times">
Dit is een andere paragraaf, geschreven in Times New Roman.
</font>
</p>

Ziet er gemakkelijk uit hé? Is het ook.

Attribuut:	Voorbeeld:	Doel:
size="nummer"	size="2"	Geeft fontgrootte aan.
size="+nummer"	size="+1"	Vergroot de fontgrootte.
size="-nummer"	size="-1"	Verkleint de fontgrootte.
face="Lettertype naam"	face="Times"	Geeft lettertype aan. Namelijk Times New Roman.
color="kleurwaarde"	color="#eeff00"	Geeft fontkleur aan.
color="kleurnaam"	color="red"	Geeft fontkleur aan.

Gebruik van de style-tag:

<html>
<body>
<style="font-family:verdana">Nu maak je een paragraaf zonder font<br>
<style="font-family:courier">Hier gebruik je keurig de styletags!<p>
</body>
</html>

Nu maak je een paragraaf zonder font
Hier gebruik je keurig de styletags!

De grootte aanpassen met styles (in procenten.):

<html>
<body>
<h1 style="font-size:150%">Een kop van een pagina</h1>
<p style="font-size:80%">Een paragraaf met Styles!</p>
</body>
</html>

Een kop van een pagina

Een paragraaf met Styles!

De kleur van de letters aangeven met styles:

<html>
<body>
<h1 style="color:blue">Een Kop van een pagina</h1>
<p style="color:red">Een paragraaf met Styles</p>
</body>
</html>

Een Kop van een pagina

Een paragraaf met Styles

En als je nu alles combineert dan ziet het er zo uit:

<html>
<body>
<p style="font-family:verdana;font-size:80%;color:green">Dit is een paragraaf met tekst erin! De tekstkleur is groen, lettertype is: Verdana en de grootte is 80%</p>
</body>
</html>

Dit is een paragraaf met tekst erin! De tekstkleur is groen, lettertype is: Verdana en de grootte is 80%

Webdesign