Editie 168 - HTML-cursus

(0 reviews)

1. Hoeveel procent heb je GTA Vice City uitgespeelt?
- 10%
  
  6%
  
  5
- 20%
  
  7%
  
  6
- 30%
  
  1%
  
  1
- 40%
  
  2%
  
  2
- 50%
  
  13%
  
  11
- 60%
  
  7%
  
  6
- 70%
  
  4%
  
  4
- 80%
  
  8%
  
  7
- 90%
  
  48%
  
  40
- 100%
  
  0%
  
  0

This poll is closed to new votes

Please sign in or register to vote in this poll.

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 PHP in combinatie met MySQL. Later zullen we ook steeds meer Javascript bereiken. 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 Firefox. Hierdoor kunnen er kleine verschillen zijn in je eigen situatie. In sommige gevallen geeft Firefox de codes anders weer als bijvoorbeeld Internet Explorer of Netscape. Veel plezier met deze nieuwe rubriek!

Welkom bij les nummer 11. We gaan verder waar we vorige week zijn gebleven, tabellen.

Tekst bij een tabel

Het is soms handig om tekst om een tabel heen te laten gaan. Het is erg gemakkelijk om te doen. Kijk naar de code hieronder:

<table align="left"><tr><td>test1</td>test2</td></tr>
<tr><td>test3</td><td>test4</td></tr></table>

Dit geeft onderstaand resultaat:

[table=simple]test1|test2

test3|test4[/table]

Merk hier op dat de tabel dus links is uitgelijnd. Zodra je dan in het P element tekst direct achter de tabel plaatst, komt deze tekst mooi bij de tabel te staan:

<table align="left"><tr><td>test1</td>test2</td></tr>
<tr><td>test3</td><td>test4</td></tr></table><p>Hier kun je dus die tekst plaatsen.</p>

Tabel in tabel

Ook is het mogelijk om in een cel van je tabel, een andere tabel te plaatsen. Hieronder een voorbeeld hiervan:

<table border ="1"><tr><td>Eerste tabel</td><td><h1>Koptekst</h1>
<table border ="1" align="right"><tr><td><img src="http://www.gtaforum.nl/uploads/profile/photo-81942.jpg" /></td></tr>
<tr><td>Hier kun je tekst plaatsen</td></tr></table></td></tr></table>

Een redelijk lastige code, ook niet uit te voeren in BB-code. Vandaar hieronder een afbeelding hoe hij het weergeeft in Firefox:

Celinhoud uitlijnen

Het uitlijnen van tekst zullen jullie nu inmiddels wel weten. In ieder geval links en rechts, dit gaat met ALIGN. Boven en onder is ook mogelijk, dit gaat met VALIGN. Kijk maar in het voorbeeld hieronder:

<table border="2"><tr><td align="center" valign="center">tekst1</td><td align="left" valign="right">tekst2</td><tr></table>

Dit resulteert dus in een tabel met een mooi uitgelijnde tekst.

Achtergrondkleur van een tabel

De achtergrondkleur van een tabel is erg gemakkelijk. Zie het voorbeeld hieronder:

<table bgcolor="blue"><tr><td>tekst1</td><td>tekst2</td></tr>
<tr><td>tekst3</td><td>tekst4</td></tr></table>

Deze code geeft je dus een blauwe achtergrond. Uiteraard kun je ook andere kleuren gebruiken en kleurcodes.

En dat was les nummer 11. Volgende keer komt les 12, waarin we weeral verder gaan met tabellen. Hopelijk tot de volgende keer!

Editie 168 - HTML-cursus

Hoeveel procent heb je GTA Vice City uitgespeelt? 91 members have voted

1. Hoeveel procent heb je GTA Vice City uitgespeelt?

0 Comments

Recommended Comments

Account

Navigation

Search

Configure browser push notifications

Chrome (Android)

Chrome (Desktop)

Safari (iOS 16.4+)

Safari (macOS)

Edge (Android)

Edge (Desktop)

Firefox (Android)

Firefox (Desktop)