Je Eigen Plaatjes in Lijsten

In dit artikel leer je een eenvoudige code waarmee je je eigen plaatjes kunt gebruiken bij een lijst in HTML.
De standaard Unordered List (UL) ziet er als volgt uit:

• appels
• peren
• bananen

Je ziet de zwarte bolletjes die voor de woorden staan.
Dit zijn de standaardsymbolen voor zo'n lijst.
Je kunt je eigen plaatjes gebruiken door de volgende CSS code te gebruiken:

list-style-image: url("plaatje.gif");

Hieronder zie je een voorbeeld van het gebruik van eigen plaatjes in een lijst:

• appels
• peren
• bananen

Je kunt op deze manier plaatjes gebruiken die beter bij het ontwerp van je site passen.
Als je voor bepaalde lijsten verschillende plaatjes wilt gebruiken, dan kan dat door gebruik te maken van classes.
Zo bijvoorbeeld:

ul.ster { list-style-image: url(images/ster.gif); }
ul.cirkel { list-style-image: url(images/cirkel.jpg); }

MijnHomepage Tip