Jump to content
Bekijk in de app

Een betere weg om onze GTA community te volgen. Leer meer.

GTAGames.nl - De Nederlandse Grand Theft Auto Community!

Een volledig scherm app op het beginscherm inclusief notificaties, badges en meer.

Om deze app op je iPhone en iPad te installeren
  1. Druk op het icoon in Safari
  2. Scroll in het menu en druk op Zet op beginscherm.
  3. Druk op Voeg toe rechts bovenaan.
Om deze app op je Android toe te voegen
  1. Druk op het 3-punten menu (⋮) rechts bovenaan in de browser.
  2. Druk op Toevoegen aan beginscherm of Installeer app.
  3. Druk op Toevoegen om te bevestigen.

gallery_108553_47_10996.gif

Deze rubriek is geschreven door Kloep!

Hallo, en welkom bij de HTML-cursus van OWN. In deze rubriek gaan wij (VWO-er en Kloep) zaken vertellen die handig zijn om te weten als je met HTML aan de slag gaat. Later zullen we HTML verder gaan uitwerken, dit ook onder andere met behulp van CSS. Als we dit allemaal hebben gehad, gaan we over naar wat Javascript. In het begin zullen we dus met de basis beginnen, maar zonder deze basis kun je niet verder komen. In deze cursus zul niet alleen lappen tekst te zien krijgen, maar alles zal worden uitgelegd door middel van afbeeldingen. Hierdoor zullen het geen saaie lange verhalen worden, maar zal alles in kleine stappen worden uitgelegd.

In deze rubriek maken we gebruik van het programma Notepad++ en Google Chrome. Hierdoor kunnen er kleine verschillen zijn in je eigen situatie. In sommige gevallen geeft Chrome de codes anders weer als bijvoorbeeld Internet Explorer of Firefox.

Welkom bij les nummer 19. We gaan nu verder met CSS. Vorige week waren we hier ook al mee bezig. Deze week gaan we er gewoon mee verder.

Spatiëring regelen

Wat is nu weer Spatiëring? Dat dacht ik ook toen ik het eerst zag. Het is de ruimte tussen woorden en/of letters vergroten en/of verkleinen. Voor de ruimte tussen woorden gebruik je WORD-SPACING, voor letters gebruik je LETTER-SPACING. Hieronder een voorbeeld:

CSS:

h1 {
color: blue;
font-style: bold;
}

h2 {
color: blue;
font-style: bold;
letter-spacing: 6px;
}



HTML:

<h1>Deze tekst staat normaal</h1>
<h2>Deze tekst staat verder uit elkaar</h2>



Bovenstaand geeft dus het volgende resultaat:

10nu9uw.jpg

Inspringingen toevoegen

Inspringingen in je tekst zijn ook erg gemakkelijk toe te voegen met CSS. Hiervoor gebruik je de CSS regel TEXT-INDENT. Zie hieronder het voorbeeld:

CSS:

h1 {
color: blue;
font-style: bold;
}

p {
text-indent: 30px;
}



HTML:

<h1>Hier is je titel</h1>
<p>Hier heb je de pagina.</p>



Onderstaand resultaat krijg je dan:

20fcnet.jpg

Tekst uitlijnen

Ook het uitlijnen van je tekst kan erg gemakkelijk met CSS gedaan worden. Dit doe je met TEXT-ALIGN. Zie hieronder:

CSS:

h1 {
color: blue;
font-style: bold;
}

p {
text-align: right;
}

h2 {
text-align: left;
}



HTML:

<h1>Hier is je titel</h1>
<p>Hier heb je de pagina rechts.</p>
<h2>En hier links.</h2>



Onderstaand resultaat krijg je dan:

2icbkfo.jpg

Hij is wel wat verkleind, zodat hij wat beter op de pagina past.

Dan zijn we nu klaar met les nummer 19. Volgende week houden we ons ongeveer met hetzelfde bezig. Elke week breiden we de kennis weer iets uit.

0 reacties

Recommended Comments

Er zijn geen reacties om weer te geven.

Gast
Reactie toevoegen...

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.