Site hosted by Angelfire.com: Build your free website today!

LIJSTEN (deel 1)


Om onderwerpen, of wat je maar wilt, overzichtelijk op je pagina te kunnen rangschikken kent HTML de lijstdefinities. Er zijn drie varianten:

  1. de gesorteerde lijst
  2. de ongesorteerde lijst
  3. de definitie-lijst

Hierboven zie je een voorbeeld van de gesorteerde lijst. Wat ik hiervoor heb gebruikt is het volgende:
<OL>
<LI>de gesorteerde lijst
<LI>de ongesorteerde lijst
<LI>de definitie-lijst
</OL>

Eigenlijk heel eenvoudig dus. Eerst <OL> om een genummerde lijst (Orderd List) te beginnen. Vervolgens elk regeltje vooraf laten gaan door <LI> (van LIst) , waardoor er een nummer aan het begin van de regel wordt geplaatst en tenslotte afsluiten met </OL>.
Merk ook meteen op dat elke regel ietst inspringt ten opzichte van de gewone tekst.

Met <OL> maak je een geordende lijst die standaard bestaat uit cijfers
<LI> heeft géén eindlabel

In dit eenvoudige voorbeeld worden de onderwerpen uit de lijst automatisch genummerd, te beginnen bij één. Aan het label <OL> had ik ook de optie START="n" kunnen toevoegen. In dat geval was de nummering begonnen met de waarde die ik voor n zou hebben ingevuld. Dus bijvoorbeeld <OL START="21"> zou hebben geresulteerd in het volgende:

  1. de gesorteerde lijst
  2. de ongesorteerde lijst
  3. de definitie-lijst

Een andere mogelijkheid was geweest om de lijst niet te nummeren, maar bijvoorbeeld vooraf te laten gaan door de letters uit het alfabet. Dat doe je door middel van de toevoeging TYPE="a". <OL TYPE="a"> geeft het volgende resultaat:

  1. de gesorteerde lijst
  2. de ongesorteerde lijst
  3. de definitie-lijst

Met <OL> maak je een geordende lijst die bestaat uit letters wanneer je bij <OL> toevoegt TYPE="a"

In plaats van TYPE=a kun je ook gebruik maken van TYPE=A. De onderwerpen uit je lijst worden dan vooraf gegaan door hoofdletters i.p.v. kleine letters.Andere mogelijkheden zijn TYPE=I voor Romeinse cijfers of TYPE=i voor kleine Romeinse cijfers. Die laatste mogelijkheid vind ik persoonlijk nog al lelijk, maar de keuze is aan jou.

Als je bovenstaande begrepen hebt is de ongesorteerde lijst gemakkelijk. In plaats van <OL> gebruik je <UL> (Unorderd List). In plaats van nummers of letters wordt ieder onderwerp uit je lijst dan vooraf gegeaan door een "bullet". Maar ook de vorm van die bullet kun je aanpassen:

Met <UL> maak je een ongeordende lijst die bestaat uit rondjes (standaard), vierkantjes of cirkels. In de laatste twee gevallen zet je resp. TYPE="square" en TYPE="circle" in het <LI>label

Om de verschillende mogelijkheden in één lijst te laten zien heb ik de optie TYPE= niet opgenomen in het <UL>label, maar in het label <LI>, want ook dat is dus mogelijk.
Een ongesorteerde lijst sluit je natuurlijk af met </UL>

De derde lijstvorm, de definitielijst vergt wat meer aandacht. Daarover meer in het volgende hoofdstuk waar ik deze lijstvorm zal toepassen om een overzicht van al het voorgaande te geven.

Binnen een lijst kun je weer nieuwe lijsten aanmaken. Dit is vooral handig als een onderwerp uit je lijst zelf ook weer uit meerdere onderwerpen bestaat.
Achter een <LI>label gebruik je gewoon weer <OL> of <UL>.

<OL>
<LI>de gesorteerde lijst
<LI>de ongesorteerde lijst
<UL>
<LI TYPE="square">appels
<LI TYPE="square">peren
<LI TYPE="square">bananen
</UL>
<LI>de definitie-lijst
</OL>
geeft het volgende als resultaat:
  1. de gesorteerde lijst
  2. de ongesorteerde lijst
  3. de definitie-lijst