HAKKOD
Filistin'e insani yardım sağlanmasına yardım edin

Sırasız Liste Tipleri

HTML Dersleri > Sırasız Liste Tipleri

Sırasız bir liste tutarken elemanların yanına içi dolu daire, içi boş daire ve kare sembollerini koyabiliriz. Aynısı HTML'de de mevcuttur. Bunun için type niteliğini kullanırız.

Sırasız listemizdeki elemanların sol tarafındaki sembolün içi boş daire olmasını sağlamak için type niteliğine circle değerini girmemiz gerekmektedir. Bunun kullanım örneği aşağıda verilmiştir.

<!doctype html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>İslamın Şartları</title>
  </head>
  <body>
    <ul type="circle">
      <li>Allah'ın Varlığına ve Birliğine İman</li>
      <li>Allah'ın Kitaplarına İman</li>
      <li>Peygamberlere İman</li>
      <li>Meleklere İman</li>
      <li>Ahiret Gününe İman</li>
      <li>Kadere ve Kazaya İman</li>
    </ul>
  </body>
</html>

Sırasız liste sembolümüzü kare yapmak için type niteliğine square değerini girmemiz gerekmektedir.

<!doctype html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>İmanın Şartları</title>
  </head>
  <body>
    <ul type="square">
      <li>Allah'ın Varlığına ve Birliğine İman</li>
      <li>Allah'ın Kitaplarına İman</li>
      <li>Peygamberlere İman</li>
      <li>Meleklere İman</li>
      <li>Ahiret Gününe İman</li>
      <li>Kadere ve Kazaya İman</li>
    </ul>
  </body>
</html>

Gördüğünüz gibi listemizdeki elemanların sol tarafındaki sembol kare olmuş oldu.

Eğer type niteliğini girmeden bir liste oluşturursanız arka planda type değeri otomatik olarak type="disc" olacaktır. Bunu bir örnekle gözlemleyelim.

<!doctype html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>İmanın Şartları</title>
  </head>
  <body>
    <p>type kullanılmayan örnek</p>
    <ul>
      <li>Allah'ın Varlığına ve Birliğine İman</li>
      <li>Allah'ın Kitaplarına İman</li>
      <li>Peygamberlere İman</li>
      <li>Meleklere İman</li>
      <li>Ahiret Gününe İman</li>
      <li>Kadere ve Kazaya İman</li>
    </ul>
    <p>type="disc" kullanılan örnek</p>
    <ul type="disc">
      <li>Allah'ın Varlığına ve Birliğine İman</li>
      <li>Allah'ın Kitaplarına İman</li>
      <li>Peygamberlere İman</li>
      <li>Meleklere İman</li>
      <li>Ahiret Gününe İman</li>
      <li>Kadere ve Kazaya İman</li>
    </ul>
  </body>
</html>

Gördüğünüz gibi ikisi arasında hiçbir fark yok. Çünkü ul etiketi varsayılan olarak type="disc" değerini alır.

Eğer listemizin elemanlarının yanına hiçbir sembol göstermek istemiyorsak o zaman type="none" niteliğini kullanırız.

<!doctype html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>İmanın Şartları</title>
  </head>
  <body>
    <ul type="none">
      <li>Allah'ın Varlığına ve Birliğine İman</li>
      <li>Allah'ın Kitaplarına İman</li>
      <li>Peygamberlere İman</li>
      <li>Meleklere İman</li>
      <li>Ahiret Gününe İman</li>
      <li>Kadere ve Kazaya İman</li>
    </ul>
  </body>
</html>

Gördüğünüz gibi type="none" niteliğini girince liste elemanlarımızın yanında hiçbir sembol gözükmedi.