banner

6.3: Definitielijsten

In de vorige les werden twee vormen van lijsten besproken: de gesorteerde lijst en de ongesorteerde lijst. Er is nog een derde soort lijst n.l. de definitie-lijst.
Bij een definitielijst wordt er geen nummer of bullet voor het onderwerp geplaatst, maar een trefwoord. Deze lijstvorm leent zich dan ook bij uitstek beschrijvingen van een bepaald trefwoord. De werkwijze is niet veel anders dan bij de andere twee lijstvormen, het resultaat zal er echter heel anders uitzien.
Het trefwoord komt, in plaats van de bullet, netjes links tegen de kantlijn te staan, terwijl de rest van de tekst daaronder iets inspringt.

Om aan te geven dat je een definitielijst wilt maken gebruik je eerst <dl>. Elk nieuw onderwerp open je met <dt>, gevolgd door het trefwoord, om daarna weer met </dt> af te sluiten. Daarna gebruik je <dd> waarna je een beschrijving (definitie) van het trefwoord kunt geven, vervolgens sluit je weer af met </dd>. Ten slotte sluit je de lijst af met </dl>.

<dl>
    <dt>Trefwoord 1</dt>
        <dd>Beschrijving van het eerste trefwoord</dd>
    <dt>Trefwoord 2</dt>
        <dd>Beschrijving van het tweede trefwoord</dd>
</dl>
Geeft het volgende resultaat:
Trefwoord 1
Beschrijving van het eerste trefwoord
Trefwoord 2
Beschrijving van het tweede trefwoord

Binnen een lijst zijn de diverse opmaak mogelijkheden gewoon toepaspaar. Bovenstaand voorbeeld kunnen we bijvoorbeeld op de volgende manier verfraaien:

<dl>
    <dt><strong>Trefwoord 1</strong></dt>
        <dd><em>Beschrijving van het eerste trefwoord</em></dd>
    <dt><strong>Trefwoord 2</strong></dt>
        <dd><em>Beschrijving van het tweede trefwoord</em></dd>
</dl>
Geeft het volgende resultaat:
Trefwoord 1
Beschrijving van het eerste trefwoord
Trefwoord 2
Beschrijving van het tweede trefwoord

Opdracht 17: Definitielijsten

  • Maak een nieuwe pagina 'definities.html' en plaats deze pagina in de ROOT-map (ter hoogte van de index.html pagina)
  • Maak een link vanaf de index-pagina naar deze pagina en ook een link terug.
  • Maak in 'definities.html' een definitielijst die de definities beschrijft van de volgende termen:
    • Besturingssysteem
    • Applicaties
    • Hardware
  • Zoek van elke term de definitie op en plaatst die in de definitielijst