<li> Kullanımı

Liste yapımına bazen ihtiyaç duyabiliyoruz. Bu derste <li> kullanımını birlikte öğreneceğiz.

Bu derste

  • kullanımını birlikte öğreneceğiz.

    Liste yapımına bazen ihtiyaç duyabiliyoruz. Listelerimizde nokta biçiminde sıralayabiliyor, rakamsal, resim, ve tasarım, kod bilginize dayanarak farklı özelliklerde kullanmanız mümkündür.

    Örnek-1 bir liste oluşturalım:

    [*] Deneme
    [*] Deneme

    Yukarıdaki Örnek-1 listesinde kullandığımız nokta ile sıralamadır.


    Örnek-2 bir liste oluşturalım:

    1. Deneme
    2. Deneme

    Yukarıdaki Örnek-2 listesinde kullandığımız rakamsal olarak sıralamadır.


  • Kaldırma


  • Bazen çalışmalarımızda ve liste oluşturduğumuzda kullanmamız gereken listelerde nokta iste başlarında bulunmaktadır. Bu noktalar bazı tasarımlarda hoş görüntü sağlamamaktadır. Bu nedenle noktaları kaldırma ihtiyacı duyarız.

    İsterseniz, örneklerle anlatalım. Kaldırmak için style dosyamızda kullanacağımız kod:


    list-style-type:none;



    Örnek


    <!DOCTYPE html>

    <html>

    <body>



    <p>Yiyecek Listesi [Nokta kullanımı.]</p>

    <ul>

      <li>Pizza</li>

      <li>Gözleme</li>

      <li>Tost</li>

    </ul>



    <p>Yiyecek Listesi [Nokta Kaldırma.]</p>

    <ul style="list-style-type:none;">

      <li>Pizza</li>

      <li>Gözleme</li>

      <li>Tost</li>

    </ul>



    <p>Örnek Kullanım</p>

    <p>Yiyecek Listesi [Nokta kullanımı.]</p>

    <ul>

      <li>1.Pizza</li>

      <li>2.Gözleme</li>

      <li>3.Tost</li>

    </ul>



    <p>Yiyecek Listesi [Nokta Kaldırma.]</p>

    <ul style="list-style-type:none;">

      <li>1.Pizza</li>

      <li>2.Gözleme</li>

      <li>3.Tost</li>

    </ul>

    </body>

    </html>



    value Kullanımı


    <!DOCTYPE html>

    <html>

    <body>

    <p>Yiyecek Listesi</p>

    <ul>

      <li value="1">Pizza</li>

      <li value="2">Gözleme</li>

      <li value="3">Tost</li>

    </ul>

    </body>

    </html>



    type Kullanımı


    <!DOCTYPE html>

    <html>

    <body>

    <p>Yiyecek Listesi</p>

    <ul>

      <li type="square">Pizza</li>

      <li type="square">Gözleme</li>

      <li type="square">Tost</li>

    </ul>

    </body>

    </html>



    Notlar

    [*]Tüm tarayıcılarda desteklemektedir.
    [*]li tag'ına value="" değeri atayabilirsiniz.
    [*]li tag'ına type="" sitili tanımlayabilirsiniz.

    Kolay gelsin.
    • Etiketler;
    Yorum Yaz

    Yorum yazabilmek için üye girişi yapmanız gerekiyor!

    Yukarı Git