Lister i HTML
Vi omgir oss med lister hele livet. Handlelister, huskelapper, matoppsrkfiter, leselister og så videre. Nå skal vi se hvordan vi kan bruke lister for å tydeliggjøre budskapet vi ønsker å kommunisere.
Tre forskjellige listetyper
I {HTML} har vi tre forskjellige lister til disposisjon; uordnede lister <ul>
, Ordnet (nummererte) lister <ol>
og definisjonslister <dl>
. Vi går først gjennom bruksområder for listetypene, deretter kombinerer vi dem. Du kan også utføre grafiske justeringer på listene ved bruk av {CSS}.
Anvendelsesområdene for disse listene er noe du må vurdere selv, men her er noen eksempler på bruk.
Uordnet liste
Ei uordnet liste, er som navnet tilsier, passende når rekkefølgen ikke spiller noen rolle. Hva er mer naturlig å bruke i dette listeeksemplet enn de tre forskjellige listene vi har til rådighet?
- uordnet liste (punktliste)
- ordnet (nummerert) liste
- definisjonsliste
Som du ser, oppnår vi høyere grad av system og orden, men hva om vi ønsker å vise rekkefølgen?
Ordnet liste
Her spiller plutselig rekkefølgen en rolle. Et godt eksempel på ei liste der rekkefølgen teller, er en oppskrift.
- Putt 1 liter melk i en bolle
- Dander mel, gjær og sukker mens du rører forsiktig
- Stek i ovnen på 225 grader i 20 minutter
Da kom svakheten i kokkekunst frem, for dette kan umulig bli noe godt, men poenget er at rekkefølgen er viktig Da er vi klare til å se på den siste formen for lister.
Definisjonsliste
Den som ikke vet hva ei definisjonsliste er, bør undersøke betydningen av ordet definisjon. La oss bruke denne listetypen for å illustrere de tre listetypene, hehe.
- Uordnet liste
- Ei uordnet liste er ei punktliste du kan bruke når rekkefølgen av data ikke er viktig.
- Ordnet liste
- Ei nummerert liste som brukes når rekkefølgen er viktig.
- Definisjonsliste
- Dette er ei definisjonsliste. Vi derfinerer noe.
Da skulle budskapet om lister være klekkelig klart, men vi kan også kombinere de tre listene!
Kombinasjon av lister
- Eksempel på ei uordnet liste
-
- uordnet liste (punktliste)
- ordnet (nummerert) liste
- definisjonsliste
- Eksempel på ei ordnet liste
-
- Putt 1 liter melk i en bolle
- Dander mel, gjær og sukker mens du rører forsiktig
- Stek i ovnen på 225 grader i 20 minutter
Ovenfor nøster vi ei ordnet og uordnet liste i ei definisjonsliste.
Lær mer om lister!
Hvis du vil lære mer om lister, anbefales W3Schools HTML-artikkel om lister. På den samme siden finner du forøvrig et spekket register over mange andre webrelaterte emner, og nettstedet er engelsk.