Eenvoudige HTML en CSS

De eenvoudigste pagina

De eenvoudigste webbladzijde is een tekstbestand met daarin alleen maar:

<html> <p>Tekst van de pagina. </html>

Maak dit aan in een teksteditor zoals Notepad. Of gebruik WordPad of Word, maar bewaar het bestand dan als tekstbestand. Geef het een naam als "blz.htm" of "blz.html".

Start vervolgens een browser zoals Internet Explorer, Netscape Navigator, Mozilla, Opera, lynx en open de pagina die je net hebt opgeslagen. Je ziet je eerste eigengemaakte webpagina.
Hier meer over deze werkwijze.

Zoals je ziet bestaat HTML uit tekst met daartussen commando's die tussen de tekens "kleiner dan" < en "groter dan" > staan. Sommige commando's beginnen ergens, en hebben ook een eind, wat aangegeven wordt hetzelfde commando, maar dan met een schuine streep (slash) ervoor.
Voorbeeld: </html>.
Er zijn ook commando's die zo'n einde mogen maar niet hoeven hebben, zoals <p>. Nog andere hebben nooit een eind, bijvoorbeeld <br>.

Helemaal volgens de regels is dit zeer eenvoudige bestand nog niet. Om het netter te doen is wat meer structuur aan te raden. Maar dat is van later zorg.

Eerst gaan we kijken naar de tekststructuur.

Alinea's

Hier staat de tekst van een alinea. Een alinea kan uit meerdere zinnen bestaan. Een alinea wordt in een tekstverwerker afgesloten met een "harde return". In HTML maakt het niet uit waar de harde returns staan, die worden als spaties opgevat. Meerdere spaties en harde returns achter elkaar tellen als één enkele spatie. Een alinea wordt in HTML aangeduid met <p>.

Het is mogelijk om binnen dezelfde alinea op een nieuwe regel te beginnen.
Hier begint een nieuwe regel, hoewel de alinea nog niet afgelopen is. De code in HTMl hiervoor in <br>.

Tekst kan vet, cursief of onderstreept zijn, maar het is veel beter dat met CSS te doen. Hetzelfde geldt voor de mogelijkheid lettertype, grootte en kleur aan te geven: niet doen, CSS is beter, en daar kan ook alles mee.

Een stukje tekst kan kleiner zijn en dan hoger of lager staan, het zogenaamde superscript en subscript, wat handig is voor kwadraten (x2) en voor chemische formules (H2O is water, H2SO4 is zwavelzuur, en H2S stinkt).


Een horizontale lijn, aangegeven met <hr>, kan dienen om een stuk van een webbladzijde af te grenzen, zoals hierboven en hieronder.


In aparte html-bestanden ga ik verder in op: