Nasıl Oluşturulur: Liste Grubu

CSS kullanarak temel listeleri 'liste grubu'ya nasıl dönüştürmeyi öğrenin.

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

Try It Yourself

Liste Grubu Nasıl Oluşturulur

İlk Adım - HTML Ekleme:

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

İkinci Adım - CSS Ekleme:

ul {
  list-style-type: none; /* Proje işaretlerini kaldırmak için */
  padding: 0; /* İç boşlukları kaldırmak için */
  margin: 0; /* Dış boşlukları kaldırmak için */
}
ul li {
  border: 1px solid #ddd; /* Her liste ögesine ince çerçeve eklemek için */
  margin-top: -1px; /* İki kenar çerçeveyi önlemek için */
  background-color: #f6f6f6; /* Gri arka plan rengi eklemek için */
  padding: 12px; /* Eklemek için bazı iç boşluklar */
}

Try It Yourself

Related Pages

Tutorial:CSS List