HTML Listeler - Uzmanim Akademi

uzmanimAkademi ❯ HTML CSS JAVASCRIPT ANGULAR

HTML Öğren

HTML Genel HTML Giriş HTML Editörler HTML Temeller HTML Element HTML Öznitelik HTML Başlık HTML Paragraf HTML Stil HTML Metin Biçimlendirme HTML Alıntı HTML Yorum HTML Renk HTML CSS HTML Link HTML Resim HTML Tablo HTML Listeler HTML Blok ve Satiriçi HTML Class Özniteliği HTML iFrame HTML JavaScript HTML Dosya Yolu HTML Head HTML Düzeni HTML Responsive HTML Listeler ❮ Önceki Sonraki ❯

HTML Listeleme etiketlerini pek çok amaç için kullanırız.

Öncelikle elimizde liste şeklinde görüntülenecek veri varsa listeleme etiketleri ile biçimlendirebiliriz.

Ayrıca HTML sayfalardaki menü gibi yapıları oluştururken de listeleme etiketlerinden faydalanırız.

HTML'de üç tür liste vardır:

• Sıralı Liste
• Sırasız Liste
• Tanımlı Liste

HTML Sırasız Liste

HTML sırasız liste <ul> etiketi ile başlar. Liste içindeki elemanlar <li> etiketi ile yazılır.

Örnek

<ul> <li>İstanbul</li> <li>Ankara</li> <li>İzmir</li> </ul>

Kendin Dene »

Liste öğe işaretcisi istenirse değiştirilebilir. Bunun için CSS'den faydalanabiliriz.

Sırasız Listeleme Liste Öğe İşaretcisi Değiştirme

CSS list-style-type özelliği ile işaretcinin görünümü değiştirilebilir.

Değer	Açıklama
disc	İçi dolu yuvarlak
circle	İçi boş yuvarlak
square	İçi dolu kare
none	İşaretçi yok

Örnek

<ul style="list-style-type:square"> <li>Elma</li> <li>Armut</li> <li>Kiraz</li> </ul>

Kendin Dene »

HTML Sıralı Listeleme

HTML sıralı liste <ol> etiketi ile başlar. Liste içindeki elemanlar <li> etiketi ile yazılır.

Örnek

<ol> <li>Galatasaray</li> <li>Fenerbahçe</li> <li>Beşiktaş</li> </ol>

Kendin Dene »

Sıralı Listeleme Type Özniteliği

Sıralı listelemede sıralama yaparken sadece sayılar kullanılmaz. Type özniteliği ile işaretci türü değiştirilebilir.

Type	Açıklama
type="1"	Listeleme sayılar ile yapılır
type="A"	Listeleme büyük harfler ile yapılır
type="a"	Listeleme küçük harfler ile yapılır
type="I"	Listeleme büyük roma rakamları ile yapılır
type="i"	Listeleme küçük roma rakamları ile yapılır

Örnek

<ol type="A"> <li>Uçak</li> <li>Araba</li> <li>Gemi</li> </ol>

Kendin Dene »

HTML Tanımlı Liste

Tanımlı listeleme diğer iki listeleme türünden biraz farklıdır.

Bu listeleme türünde, listelenecek öğelere başlık eklemek mümkündür.

Tanımlı listede, <dl> ile tanımlı liste oluşturulur. <dt> etiketi ile listelencek öğelere başlık verilir, <dd> ile liste elemanları yazılır.

Örnek

<dl> <dt>İçecekler</dt> <dd>Kahve</dd> <dd>Çay</dd> <dd>Su</dd> <dt>Tatlılar</dt> <dd>Baklava</dd> <dd>Sütlaç</dd> <dd>Tiramisu</dd> </dl>

Kendin Dene »

❮ Önceki Sonraki ❯

Anlamadığınız bir konu mu var?

Konu ile ilgili sorunuzu uzmanim.net'e sorabilirsiniz: uzmanim.net'e sor!

AD

AD