Hoş Geldin, Ziyaretçi!

Forum içeriğine ve tüm hizmetlerimize erişim sağlamak için foruma kayıt olmalı ya da giriş yapmalısınız. Foruma üye olmak tamamen ücretsizdir.

HTML Liste Oluşturma

  • Konbuyu başlatan Thous
  • Başlangıç tarihi
Thous

Thous

Yönetici
Yönetici
Katılım
28 Şub 2022
Mesajlar
366
Konum
Samsun
Web
tilki.net
Kredi
3,614
Points
532
Ticaret: 1 / 0 / 0
HTML liste oluşturma işlemi iki farklı şekilde yapılmaktadır. Bu yazımda sıralı ve sırasız liste oluşturma işlemlerinin nasıl yapıldığını elimden geldiğince aktarmaya çalışacağım.

HTML Sıralı Liste Oluşturma​

HTML de liste oluşturmak için bu yazımda göstereceğim ilk alternatif sıralı liste oluşturmak olacak. Sıralı liste oluşturmak için iki farklı etiketi bilmemiz gerekiyor. Bu etiketleri kod içine aldım. Dikkat etmemiz gereken konu ise etiketleri iç içe kullanmaktır.

HTML:
    <ol>
        <li>HTML Liste Oluşturma </li>
        <li>HTML Liste Nasıl Oluşturulur?</li>
        <li>HTML Sayılı Liste</li>
        <li>HTML Sıralı Liste</li>
    </ol>

Html sirali liste nasil olusturulur

HTML'de yukarıdaki kodları kullanarak sıralı liste oluşturduğunuzda resmin sağ tarafındaki gibi gözükecektir. Listedeki 1. maddeye, alt madde eklemek için </li> kodunun altına tekrar <ol> <li>1. maddenin alt maddesi</li> </ol> şeklinde ekleme yapmalısınız. Şimdi ikinci yöntemimiz olan sırasız liste oluşturma işleminin nasıl yapılacağına kısaca göz atalım.


HTML Sırasız Liste Oluşturma​

Sırasız liste oluşturmak için de, tıpkı sıralı listelerde olduğu gibi iki farklı etiketi bilmemiz gerekiyor. Bu etiketleri kod içine alarak aşağıda paylaştım.

HTML:
<ul>
<li>HTML Sırasız Liste 1. Seçenek</li>
<li>HTML Sırasız Liste 2. Seçenek</li>
<li>HTML Sırasız Liste 3. Seçenek</li>
<li>HTML Sırasız Liste 4. Seçenek</li>
</ul>

Html sirasiz liste

Yukarıda yazmış olduğumuz kod, tarayıcı tarafında yukarıdaki şekilde gözükmektedir. Peki listedeki seçeneklere alt madde eklemek istersek ne yapmalıyız? Eğer böyle bir düşünceniz var ise, örnek olarak 1. seçeneğe alt madde ekleyelim ve aklınızdaki soru işaretlerini giderelim. 1. seçeneğin bittiği </li> bölümünden hemen sonra tekrar <ul> <li> </li> </ul> etiketlerini açmamız gerekiyor. Bu işlemi de aşağıdaki gibi yapabilirsiniz.

HTML:
    <ul>
        <li>HTML Sırasız Liste 1. Seçenek</li>
        <ul>
            <li>HTML Sırasız Liste 1. Alt Madde</li>
        </ul>
        <li>HTML Sırasız Liste 2. Seçenek</li>
        <li>HTML Sırasız Liste 3. Seçenek</li>
        <li>HTML Sırasız Liste 4. Seçenek</li>
    </ul>

Bu yazımda sizlere HTML Liste Ekleme Kodu oluşturma işlemini detaylı şekilde anlatmaya çalıştım. Umarım işinize yarayan bir yazı olmuştur, iyi forumlar ♥