HTML Opmaak

HTML Lijsten

  • De meest voorkomende zijn de geordende en ongeordende lijsten, daarnaast zijn er de menulijst, definitielijst en de directorylijst.
  • Omdat alle belangrijke browsers zowel de menulijst als de directorylijst weergeven als een gewone ongeordende lijst, hebben de elementen <menu> en <dir> hun betekenis verloren.
  • Het gebruik ervan wordt in HTML 4 daarom afgeraden.
Element Beschrijving Attributen
<dd> Defineert de inhoud van het laatste <dt> element. geen
<dir> Definieert een lijst van bestanden (directory-list) compact
<dl> Defineert een definitielijst. geen
<dt> Defineert een item in een definitielijst. geen
<li> Definieert een item uit een lijst. type, value
<menu> Definieert een menulijst met korte items van niet meer dan één regel. compact
<ol> Specificeert een geordende lijst. compact, start, type
<ul> Specificeert een ongeordende lijst. compact, type
  • + eventuele standaard en gebeurtenis attributen.

Voorbeeld

Geordende lijst:

  1. Het eerste item
  2. Het tweede item
  3. Het derde item
  4. enz...

Ongeordende lijst:

  • Lijst item
  • Lijst item
  • Lijst item
  • enz...

naar boven 

tip

Lijsten kunnen genest worden.
Voorbeeld klik   code

Geordende lijst

  • Een geordende lijst begint met de <ol> tag.
  • Een lijst item begint met de <li> tag.
  • De lijst items worden voorafgegaan door een cijfer(standaard).
<ol>
<li>geordende lijst</li>
<li>ongeordende lijst</li>
<li>definitielijst</li>
</ol>

Resultaat :
  1. geordende lijst
  2. ongeordende lijst
  3. definitielijst

naar boven 

Ongeordende lijst

  • Een ongeordende lijst begint met de <ul> tag.
  • Een lijst item begint met de <li> tag.
  • De lijst items worden voorafgegaan door een bolletje(standaard).
<ul>
<li>geordende lijst</li>
<li>ongeordende lijst</li>
<li>definitielijst</li>
</ul>

Resultaat :
  • geordende lijst
  • ongeordende lijst
  • definitielijst

naar boven 

Menulijst

  • Het <menu> element is verouderd. Het gebruik wordt afgeraden.
  • Een lijst item begint met de <li> tag.
  • De weergave is dezelfde als een ongeordende lijst.
  • De menulijst was oorspronkelijk bedoeld als een ongeordende lijst, waarvan de items niet meer dan één regel zouden beslaan.
<menu>
<li>home</li>
<li>html</li>
<li>css</li>
<li>contact</li>
</menu>

Resultaat :
  • home
  • html
  • css
  • contact
  • naar boven 

    Definitielijst

    • Een definitielijst is een lijst, welke bestaat uit termen en bijbehorende beschrijvingen.
    • Een definitielijst begint met de <dl> tag.
    • De <dt> en <dd> tags definiëren de termen en de beschrijving.
    • De termen en de beschrijving worden gestructureerd getoond.
    <dl>
    <dt>HTML</dt>
    <dd>- Hypertext Markup Language</dd>
    <dt>CSS</dt>
    <dd>- Cascading Style Sheets</dd>
    </dl>

    Resultaat :
    HTML
    - Hypertext Markup Language
    CSS
    - Cascading Style Sheets

    naar boven 

    Directorylijst

    • Het <dir> element is verouderd. Het gebruik wordt afgeraden.
    • Oorspronkelijk zouden de items niet meer dan 20 karakters bevatten en zou de lijst in meerdere kolommen worden weergegeven.
    • Een lijst item begint met de <dir> tag.
    • De weergave is dezelfde als een ongeordende lijst.
    <dir>
    <li>geordende lijst</li>
    <li>ongeordende lijst</li>
    <li>definitielijst</li>
    </dir>

    Resultaat :
  • geordende lijst
  • ongeordende lijst
  • definitielijst
  • naar boven 

    tip

    Met behulp van stijlen heb je uitgebreide mogelijkheden om de weergave van een lijst te bepalen.

    naar boven naar boven naar ol
    naar boven naar het ol element