Laten we beginnen bij het begin. Voor deze cursus hebben we een paar HTML documenten nodig. Start Notepad (Kladblok) en type of kopieer-en-plak het volgende:

<HTML>
<HEAD>
<TITLE>Mijn Frames Pagina</TITLE>
</HEAD>
<BODY>
 
</BODY>
</HTML>

We geven elk document een eigen naam. Laten we eens meisjesnamen gebruiken J.

<HTML>
<HEAD>
<TITLE>Mijn Frames Pagina</TITLE>
</HEAD>
<BODY>
Lisa
</BODY>
</HTML>

Maak een nieuwe map aan en sla je documentje op als lisa.html.

Maak nu een nieuw HTML document.

<HTML>
<HEAD>
<TITLE>Mijn Frames Pagina</TITLE>
</HEAD>
<BODY>
Kirsten
</BODY>
</HTML>

Sla dit in dezelfde map op onder de naam kirsten.html.

Doe nu hetzelfde voor Sacha, Sharon, Laura en Alice. Sla ze op dezelfde manier op als de eerste twee. Je moet nu een map hebben met zes complete HTML documenten.
De namen heb ik willekeurig gekozen. Als je graag de naam van je vriendin(nen) wilt gebruiken, ga je gang maar doe het wel consequent.


Ok, nu het leuke gedeelte... we gaan de master pagina maken. Begin met een standaard HTML document:

<HTML>
<HEAD>
<TITLE>Mijn Frames Pagina- Master</TITLE>
</HEAD>
 
<BODY>
</BODY>
 
</HTML>


Verwijder de <BODY> tags. De master pagina gebruikt ze niet...

<HTML>
<HEAD>
<TITLE>Mijn Frames Pagina- Master</TITLE>
</HEAD>
</HTML>


...in plaats daarvan gebruiken we <FRAMESET> tags.

<HTML>
<HEAD>
<TITLE>Mijn Frames Pagina- Master</TITLE>
</HEAD>
 
<FRAMESET>
</FRAMESET>
 
</HTML>


Om de zaak een beetje overzichtelijk te houden stop ik met de <HTML>, <HEAD> en <TITLE> tags te typen. Onnodig te zeggen dat ze wel in je document moeten blijven staan.

<FRAMESET>
</FRAMESET>

Sla nu je werk op. Sla het op in de map met alle dames en geef het de naam index.html. Als je de master nu opent met je browser zal je scherm wit (of grijs) blijven. Alles wat je tot nu toe hebt gedaan is gezegd "Dit is mijn master pagina".


Laten we nu eens gaan definieren hoe de zaak eruit komt te zien. Vertel de browser het scherm te splitsen in twee kolommen die elk 50% van het scherm innemen.

<FRAMESET COLS="50%,50%">
</FRAMESET>

Je hebt nu nog steeds een blanco scherm. We hebben nog één dingetje nodig om de zaak werkend te krijgen.


We moeten de browser vertellen wat hij in elk van de frames moet zetten.

<FRAMESET COLS="50%,50%">
  <FRAME SRC="lisa.html">
  <FRAME SRC="kirsten.html">
</FRAMESET>

 

Je bent nu de trotse ouder van een operationele framepagina!

Nog één detail voor we verder gaan. Merk op <FRAMESET> een container tag is en <FRAME> niet. Voor degenen die niet weten wat dat is, een container tag heeft een begin <TAG> en een eind </TAG>.


Inleiding Les 1 Les 2 Les 3 Les 4 Les 5 Les 6 Les 7 Index