Tekstopmaak

Zonder tekstopmaak zou internet wel erg onoverzichtelijk en saai worden, gelukkig hebben de bedenkers van HTML daar ook aan gedacht.

Koppen

Het is mogelijk om met behulp van de HTML-code <hx> tekst-koppen te maken, met als x een getal tussen de 1 en de 6.

Een voorbeeld:

<html>
<head>
<title>Koppen</title>
</head>
<body>
<h1>Dit is kop een</h1>
<h2>Dit is kop twee</h2>
<h3>Dit is kop drie</h3>
</body>
</html>

Klik hier om te zien hoe het voorbeeld er uit zal zien.


Paragrafen

De teksten moeten ook onderverdeeld kunnen worden in paragrafen, dit gaat met de code <p>

Een voorbeeld:

<html>
<head>
<title>Paragrafen</title>
</head>
<body>
<p>Dit is de eerste paragraaf. 

Als je een HTML-tekst tikt
maakt het niet uit waar je de enters en         spaties tikt</p>
<p>Want de browser stelt de tekst zo in dat het
precies op het scherm past</p>
<p>Dit is de derde paragraaf</p>
</body>
</html>

Klik hier om te zien hoe het voorbeeld er uit zal zien.


Nieuwe regel

Zoals je in het vorige voorbeeld hebt kunnen zien zal je een andere manier moeten gebruiken om een regeleinde te forceren in je tekst. Hiervoor is de code <br> bedacht.
Een voorbeeld:

<html>
<head>
<title>Nieuwe regel</title>
</head>
<body>
Deze zin<br>begint steeds weer<br>op de volgende regel<br>
En deze
zin
loopt in een
keer door.
</body>
</html>

Klik hier om te zien hoe het voorbeeld er uit zal zien.


Lettergrootte

Je hebt al kunnen zien dat je door middel van de <hx>-code tekst-koppen groter op het scherm kan laten zien. Om letters in een stuk tekst groter te maken zou je dezelfde code kunnen gebruiken, maar handiger is misschien <font size=x> met als x een getal tussen 1 en 7. Als je voor veel tekst een standaard grootte wilt hebben zit je aan het begin van je document: <basefont size=x>
Een voorbeeld:

<html>
<head>
<title>Lettergrootte</title>
</head>
<body>
<basefont size=4>
De standaard grootte is vier<br>
<font size=6>Dit is grootte zes</font><br>
<font size=2>Dit is grootte twee</font><br>
<font size=7>Dit is grootte zeven</font><br>
En dit is weer grootte vier
</body>
</html>

Klik hier om te zien hoe het voorbeeld er uit zal zien.


Vet, cursief en onderstreept

Op internet kun je net zoals in normale teksten stukken vet, cursief, en onderstreept laten weergeven.
Een voorbeeld:

<html>
<head>
<title>Vet, cursief en onderstreept</title>
</head>
<body>
<basefont size=4>
Dit is gewone tekst<br>
<b>Deze tekst is vet</b><br>
<i>Deze tekst is cursief</i><br>
<u>En deze tekst is onderstreept</u><br>
</body>
</html>

Klik hier om te zien hoe het voorbeeld er uit zal zien.

!!! Als je onderstreepte tekst gebruikt houdt er dan rekening mee dat de lezer kan denken dat het een verwijzing is.


Superscript en Subscript

In sommige teksten is het ook handig om met superscript en subscript te kunen werken. Op internet gaat dat met de codes <sup> en <sub>.
Een voorbeeld:

<html>
<head>
<title>Super- en subscript</title>
</head>
<body>
<basefont size=4>
De stelling van Pythagoras is:
a<sup>2</sup>+b<sup>2</sup>=c<sup>2</sup><br>
<br>
De scheikundige notatie voor water is:
H<sub>2</sub>O
</body>
</html>

Klik hier om te zien hoe het voorbeeld er uit zal zien.


Tekst met kleuren

Teksten worden soms mooier als er kleuren in voorkomen.
Om kleuren in teksten te zetten gebruikt u de codes:
<font color="kleur"> en </font>. Voor kleur kunt u het Engelse woord opgeven of een hexadecimale waarde in de vorm #RRGGBB. Een voorbeeld:

<html>
<head>
<title>Tekst met kleur</title>
</head>
<body>
<font color="blue">Deze tekst is blauw</font><br>
<font color="yellow">Gele tekst is slecht te lezen
op een witte achtergrond</font><br>
<font color="#CD5C5C">Deze kleur heet in het Engels <i>indianred</i></font>
</body>
</html>

Klik hier om te zien hoe het voorbeeld er uit zal zien.

Meer voorbeelden van kleuren


Teksten uitlijnen

In het volgende voorbeeld kun je zien hoe je teksten kan uitlijnen:

<html>
<head>
<title>Uitlijnen</title>
</head>
<body>
<center>Deze tekst is gecentreerd</center>
<div align="center">Dit is ook gecentreerd</div>
<div align="left">Deze regel is links uitgelijnd<br>
en deze ook</div>
<div align="right">En tot slot<br>twee regels rechts</div>
</body>
</html>

Klik hier om te zien hoe het voorbeeld er uit zal zien.