Weblessen.nl - Voor iedereen die wat wil leren..


Lijsten

HTML ondersteund drie soorten lijsten: geordende lijsten, ongeordende lijsten en definitie lijsten. Van alledrie hieronder een voorbeeld en een uitleg. Een geordende lijst heeft een "echte" lijst die een overzicht maakt. dit kan bijvoorbeeld door letters of cijfers. Een ongeordende lijst heeft in plaats van een overzicht alleen punten waaraan te zien is dat het een opgesomde lijst is, voorbeeld van een ongeordende lijst is bijvoorbeeld met rondjes ervoor. Een definitie lijst heeft de definitie van het woord er net onder naast staan. (Zie voorbeeld!)
Geordend:

<ol>
<li>Keuze 1</li>
<li>Keuze 2</li>
</ol>

  1. Keuze 1
  2. Keuze 2

Nog meer voorbeelden van geordende lijsten:
<h4>Lijst met nummers:</h4>
<ol>
<li>Nummer 1</li>
<li>Nummer 2</li>
<li>Nummer 3</li>
<li>Nummer 4</li>
</ol>
Lijst met nummers:
  1. Nummer 1
  2. Nummer 2
  3. Nummer 3
  4. Nummer 4
<h4>Lijst met letters:</h4>
<ol type="A">
<li>Letter A</li>
<li>Letter B</li>
<li>Letter C</li>
<li>Letter D</li>
</ol>
Lijst met letters:
  1. Letter A
  2. Letter B
  3. Letter C
  4. Letter D
<h4>Lijst met kleine letters:</h4>
<ol type="a">
<li>Letter a</li>
<li>Letter b</li>
<li>Letter c</li>
<li>Letter d</li>
</ol>
Lijst met kleine letters:
  1. Letter a
  2. Letter b
  3. Letter c
  4. Letter d
<h4>Lijst met Romeinse cijfers:</h4>
<ol type="I">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ol>
Lijst met Romeinse cijfers:
  1. 1
  2. 2
  3. 3
  4. 4
<h4>Lijst met kleine Romeinse cijfers:</h4>
<ol type="i">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ol>
Lijst met kleine Romeinse cijfers:
  1. 1
  2. 2
  3. 3
  4. 4

Ongeordend:
<ul>
<li>Keuze 1</li>
<li>Keuze 2</li>
</ul>

  • Keuze 1
  • Keuze 2

Nog meer voorbeelden van ongeordende lijsten:
<h4>Dikgedrukte puntenlijst:</h4>
<ul type="disc">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
Dikgedrukte puntenlijst:
  • 1
  • 2
  • 3
  • 4
<h4>Lege puntenlijst:</h4>
<ul type="circle">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
Lege puntenlijst:
  • 1
  • 2
  • 3
  • 4
<h4>Dikgedrukte blokken:</h4>
<ul type="square">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
Dikgedrukte blokken:
  • 1
  • 2
  • 3
  • 4
<h4>Een genestelde lijst:</h4>
<ul>
<li>1</li>
<li>2
<ul>
<li>Sub 2.1</li>
<li>Sub 2.2
<ul>
<li>Sub 2.2.1</li>
<li>sub 2.2.2</li>
</ul>
</li>
</ul>
</li>
<li>3</li>
</ul>

Een genestelde lijst:
  • 1
  • 2
    • Sub 2.1
    • Sub 2.2
      • Sub 2.2.1
      • sub 2.2.2
  • 3
Even opletten bij een genestelde lijst dat je geen dingen door mekaar gaat gooien!

Definitie lijst:
<dl>
<dt>Keuze 1</dt>
<dd>Uitleg keuze 1!</dd>
<dt>Keuze 2</dt>
<dd>Uitleg keuze 2!</dd>
</dl>

Keuze 1
Uitleg keuze 1!
Keuze 2
Uitleg keuze 2!
Binnen een lijst kunnen alle HTML tags gebruikt worden. Probeer er eens een horizontale lijn in te verwerken. Staat heel mooi.
Veel plezier met het maken van lijsten. Zeer handig om veel gegevens overzichtelijk te noteren.


Webdesign

Maak van Weblessen.nl uw startpagina!
Plaats Weblessen.nl bij uw favorieten. Neem contact met me op.
Heb je een Hosting?
Geef hier jouw mening over jouw web hosting

Webadres.info: Goede domeinnaam kiezen

Gesponsorde links:
Budget Webhosting
Web2host.nl
10eurohost.nl
Denit Hosting Solutions
YourHosting.nl
Starthosting.nl
Eduvision.nl
Educruitment.nl
Webadres.info


De link top 5:
Gratis Computercursussen
WebmasterStartpagina
MijnStartpagina.nu
Bluebird Animatie
Anouksweb
Link aanmelden
Alle Partners

Webmasterwoordenboek
A | B | C | D | E | F
G
| H | I | J | K | L | M
N
| O | P | Q | R | S | T
U | V | W | X | Y | Z

Films vanavond op Tv:

De klok:

(advertentie)

HTML leren
PHP cursus
XML lessen
XHTML les
CSS leer
leer C
REXX online
Red Hat Linux cursus