Focus mode

HTML

Listelerle Çalışmak

Listeleme Etiketleri

Listeleri iki ana başlık altında listeleyebiliriz;

  1. Sıralı Listeler
  2. Sırasız Listeler

Sıralı Listeler

Sıralı listeler ardışık liste numaraları vermek için kullanılır. Sıralı listelerden yararlanmak için <ol> etiketi kullanılır.

    <p> Gerçek <b>tereyağı</b> nasıl anlaşılır ?</p>
    <ol>
        <li>Oda sıcaklığında tamamen erimez</li>
        <li>Suyun içinde tek parça halinde çözünür</li>
        <li>Tereyağı rengi sarı yada beyaz olabilir</li>
    </ol>

Ekran çıktısı: sıra

şeklinde olur.

Liste başındaki sıralandırmayı rakamdan başka roma rakamı veya alfabetik şeklinde de yapabiliriz. Bunun için type özelliğini kullanmamız gerekir.

<ol type="I">
  <li>Javascript</li>
  <li>C#</li>
  <li>Php</li>
</ol>

Ekran çıktısı: siralama

<ol type="A">
  <li>Javascript</li>
  <li>C#</li>
  <li>Php</li>
</ol>

Ekran çıktısı: alfabetik

Sırasız Listeler

Sırasız listeler numaralandırma olmadan oluşturduğumuz listeleredir. Her bir liste elemanı bir satırı kaplayacak şekilde yani blok etiket şeklinde oluşturulur.

<ul>
  <li>Çay</li>
  <li>Türk Kahvesi</li>
  <li>Süt</li>
</ul> 

Ekran çıktısı:

  • Çay
  • Türk Kahvesi
  • Süt

şeklinde olur. Liste elemanlarının başındaki içi dolu daireyi değiştirebilir veya silebiliriz.

**Silmek İçin: **

<ul style="list-style-type:none">
  <li>Çay</li>
  <li>Türk Kahvesi</li>
  <li>Süt</li>
</ul>

Ekran çıktısı: ​ Çay

​ Türk Kahvesi

​ Süt

şeklinde olur. Liste başındaki içi dolu daireyi değiştirmek için ise disc, square, circle değerlerini kullanabiliriz.

<ul style="list-style-type:square">
  <li>Telefon</li>
  <li>Bilgisayar</li>
  <li>Yazıcı</li>
</ul>

Ekran çıktısı: kare

Aşağıda codepen kullanarak deneyimle!

Kaynaklar

Yazılımcı olarak girebileceğin bir teknik mülakat simülasyonunu izlemek istersen: Yazılımcı Teknik Mülakat Simülasyonu

Yazılımcı olarak girebileceğin bir HR mülakat simülasyonunu izlemek istersen: Yazılımcı İle İnsan Kaynakları (İK) Mülakat Simülasyonu

Patika Plus Banner

Yazılım Kariyerinde İlerlemeni Hızlandıracak Eğitimler

Kendi kendine yazılım öğrenirken zorlanıyor, takıldığın noktalarda bir mentore mi ihtiyaç duyuyorsun? Patika+ programlarımız ile 4-8 aylık yoğun eğitim kamplarına katıl, proje tabanlı canlı dersler ve sana özel hazırlanmış eğitimlerle gereken tüm yetenekleri kazan, iş hayatına başla!

Test

Comments

You need to enroll in the course to be able to comment!