Hoe te maken: lijstgroep
- Previous page Coupon
- Next page Bordered list group
Leer hoe je een basislijst kunt converteren naar een 'lijstgroep' met CSS.
- Adele
- Agnes
- Billy
- Bob
- Calvin
- Christina
- Cindy
Hoe een lijstgroep te maken
Eerste stap - Voeg HTML toe:
<ul> <li>Adele</li> <li>Agnes</li> <li>Billy</li> <li>Bob</li> <li>Calvin</li> <li>Christina</li> <li>Cindy</li> </ul>
Tweede stap - Voeg CSS toe:
ul { list-style-type: none; /* Verwijder de lijstpunten */ padding: 0; /* Verwijder de inbuiging */ margin: 0; /* Verwijder de marges */ } ul li { border: 1px solid #ddd; /* Voeg een fijn randje toe aan elke lijstitem */ margin-top: -1px; /* Voorkom dubbele randen */ background-color: #f6f6f6; /* Voeg een grijs achtergrondkleur toe */ padding: 12px; /* Voeg wat inbuiging toe */ }
Related pages
Tutorial:CSS list
- Previous page Coupon
- Next page Bordered list group