Πώς να δημιουργήσετε: Λίστα ομάδας

Μάθετε πώς να χρησιμοποιήσετε το CSS για να μετατρέψετε μια βασική λίστα σε 'λίστα ομάδας'.

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

Δοκιμάστε το προσωπικά

Πώς να δημιουργήσετε μια λίστα ομάδας

第一步 - Προσθήκη HTML:

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

第二步 - Προσθήκη CSS:

ul {
  τύπος λίστας: none; /* αφαιρεί τα σημάδια λίστας */
  πλαίσιο: 0; /* αφαιρεί το εσωτερικό περιθώριο */
  μαργίνα: 0; /* αφαιρεί το εξωτερικό περιθώριο */
}
ul li {
  πλαίσιο: 1px solid #ddd; /* προσθέτει λεπτό πλαίσιο σε κάθε στοιχείο λίστας */
  μαργίνα κορυφής: -1px; /* αποτρέπει τα διπλά πλαίσια */
  χρώμα υποβάθρου: #f6f6f6; /* προσθέτει γκρίζο χρώμα υποβάθρου */
  πλαίσιο: 12px; /* προσθέτει μερικό εσωτερικό περιθώριο */
}

Δοκιμάστε το προσωπικά

Σχετικές σελίδες

Οδηγός:Λίστα CSS