Skip to content

Latest commit

 

History

History
174 lines (145 loc) · 3.14 KB

listeleme.md

File metadata and controls

174 lines (145 loc) · 3.14 KB

HTML 'de Listeleme

Html ' de listeleme konusunda 3 çeşit listeleme vardır.Bunlar:

  • Unordered Listeleme
  • Ordered Listeleme
  • HTML Descreption List

İlk olarak Unordered Listelemeyi inceleyelim Adından da anlaşılacağı gibi bu listeleme yönteminde belli bir order(sıralama) söz konusu değildir.Yani bir öncelik sırası falan yoktur.Öncelik sırasını ordered sıralamayı anlatırken ne demek istediğimi daha açık anlatacağım.Örnek vermek gerekirse ;

<ul style="list-style-type:disc">
  <li>Çay</li>
  <li>Ayran</li>
  <li>Türk Kahvesi</li>
</ul>

Kodun Çıktısı:

  • Çay
  • Ayran
  • Türk Kahvesi

Sıra Ordered Listelemeyi inceleyelemeye geldi. Adından anlaşılacağı gibi bu listeleme yönteminde sıralama önemli bir listeleme türüdür.Yani maddelemede kullanılan ifadelerin sırası önemlidir.Örnek vermek gerekirse ;

<ol>
 <li>ELma</li>
 <li>Armut</li>
 <li>Limon</li>
 <li>Portakal</li>
</ol>

Kodun Çıktısı:

  1. ELma
  2. Armut
  3. Limon
  4. Portakal

Ordered listemede sıralama olarak hangi maddeleme işareti istersek seçebiliriz.Nasıl gelin bunu örneklerle açıklayalım;

Örnek 1:

<ol type="1">
 <li>ELma</li>
 <li>Armut</li>
 <li>Limon</li>
 <li>Portakal</li>
</ol>

Kodun Çıktısı:

  1. ELma
  2. Armut
  3. Limon
  4. Portakal

Örnek 2:

<ol type="A">
 <li>ELma</li>
 <li>Armut</li>
 <li>Limon</li>
 <li>Portakal</li>
</ol>

Kodun Çıktısı:

  1. ELma
  2. Armut
  3. Limon
  4. Portakal

Örnek 3:

<ol type="I">
 <li>ELma</li>
 <li>Armut</li>
 <li>Limon</li>
 <li>Portakal</li>
</ol>

Kodun Çıktısı:

  1. ELma
  2. Armut
  3. Limon
  4. Portakal

Gibi örneklerle anlaşılabilir.

Ve son olarak HTML Descreption'a bakalım.Bunda ise tanımlama ve açıklama şeklinde liste oluşturulur.Bu gibi listeler <dl> etiketi ile başlar.Her terim için <dt> etiketiyle ve her tanım(açıklama) <dd> etiketi ile başlatılır.

<dl>
<dt>Çay</dt>
<dd>Sıcak içecek</dd>
<dt>Ayran</dt>
<dd>Beyaz soğuk içecek</dd>
</dl>

Kodun Çıktısı :

Çay
Sıcak içecek
Ayran
Beyaz soğuk içecek

İç içe listeler iki tane <ul> kullanımıyla kolaylıkla oluşturulabilir.

<ul>
  <li>Kahve</li>
  <li>Çay
    <ul>
    <li>Yeşil çay</li>
    <li>Siyah çay</li>
    </ul>
  </li>
  <li>Kola</li>
</ul>

Kodun Çıktısı :

  • Kahve
  • Çay
    • Yeşil Çay
    • Siyah Çay
  • Kola

Bir diğer listeleme türü ise menu şeklinde bunun için ise <ul id="menu"> etiketi kullanılarak yapılmaktadır.

<ul id="menu">
  <li>Elma</li>
  <li>Muz</li>
  <li>Portakal</li>
  <li>Kivi</li>
</ul> 
```
Kodun Çıktısı :
<ul id="menu">
  <li>Elma</li>
  <li>Muz</li>
  <li>Portakal</li>
  <li>Kivi</li>
</ul>