Sådan oprettes: Liste

Lær hvordan man bruger CSS til at konvertere en grundlæggende liste til en 'liste'.

  • Adele
  • Agnes
  • Billy
  • Bob
  • Calvin
  • Christina
  • Cindy

Prøv det selv

Sådan oprettes en liste

Første trin - Tilføj HTML:

<ul>
  <li>Adele</li>
  <li>Agnes</li>
  <li>Billy</li>
  <li>Bob</li>
  <li>Calvin</li>
  <li>Christina</li>
  <li>Cindy</li>
</ul>

Andet trin - Tilføj CSS:

ul {
  list-style-type: none; /* Fjern punkttegn */
  padding: 0; /* Fjern indre margin */
  margin: 0; /* Fjern yderligere margin */
}
ul li {
  border: 1px solid #ddd; /* Tilføj en fin kantlinje til hver listeindgang */
  margin-top: -1px; /* Forhindr dobbelt ramme */
  background-color: #f6f6f6; /* Tilføj en grå baggrundsfarve */
  padding: 12px; /* Tilføj lidt indre margin */
}

Prøv det selv

Relaterede sider

Tutorial:CSS liste