.
  HTML-12
 

Sıralı Liste Nasıl Yapılır?

Bazen sayfamız da listeler kullanmak zorunda kalırız. Mesela sevdiğimiz müzik türlerini düzene sokmamız gerekebilir. Şimdi sıralı listelere birkaç örnek verelim:

Numaralı (ya da) başka tür listeler yapalım:
Bilgilerimizi düzene sokmamıza yarayan sıralı listeler <OL> </OL> etiketlerinin arasına < LI> ekliyerek yapılır.

En sevdiğim hayvanlar:
<ol>
<li>Kediler
<li>Köpekler
<li>Balıklar
<li>Kuşlar
</ol>

Bu kodların oluşturduğu sıralı liste aşağıdaki gibidir:

En sevdiğim Hayvanlar:

  1. Kediler
  2. Köpekler
  3. Balıklar
  4. Kuşlar
Sıralı listemizin sıra numarasını Roma Rakamları ile göstermek istersek <OL> etiketimizin yanına "type" değerinin yanına Roma Rakamlarından birini yazarız.
(Mesela I ):
En sevdiğim hayvanlar:
<ol type="I">
<li>Kediler
<li>Köpekler
<li>Balıklar
<li>Kuşlar
</ol>
Bu kodların oluşturduğu sıralı liste aşağıdaki gibidir:

En sevdiğim Hayvanlar:

  1. Kediler
  2. Köpekler
  3. Balıklar
  4. Kuşlar
 
Listemizin Sıralamasında Harfler kullanalım (type)
Listelerimizin sıralanmasnda rakam değil de harf kullanmak istiyorsak <OL> etiketinin yanındaki "type" değerinin karşısına "a" yazmamız yeterli.. Belli bir harften başlamanız gerekiyorsa start etiketini kullanmanız gerekiyor... Hangi harften başlamasını istiyorsanız onun sıra numarasını yazmalısınız...
En sevdiğim hayvanlar:
<ol type="a">
<li>Kediler
<li>Köpekler
<li>Balıklar
<li>Kuşlar
</ol>
En sevdiğim Hayvanlar:
<ol type="a" start="3">
<li>Kediler
<li>Köpekler
<li>Balıklar
<li>Kuşlar
</ol>
Bu kodların oluşturduğu sıralı liste aşağıdaki gibidir:

En sevdiğim Hayvanlar:

  1. Kediler
  2. Köpekler
  3. Balıklar
  4. Kuşlar

En sevdiğim Hayvanlar:

  1. Kediler
  2. Köpekler
  3. Balıklar
  4. Kuşlar

Bugün sayılı listeleri öğrendik. Bir de sayısız listeler ve Tanımlama Listeleri var... Bunları da bir sonraki dersimizde öğreneceğiz.
Ne kadar çok deneme yaparsak o kadar çok şey öğreniriz. Bunu unutmuyoruz değil mi? Denemekten bıkmayın..
Bir de gezdiğiniz web sitelerinin kaynak kodlarını incelerseniz nasıl yapıldığını anlayabilirsiniz.

 


Sırasız Liste Nasıl Yapılır?

Şimdi de sırasız listeleri öğrenelim. Yani bir sıraya dizilmemiş, numaralandırılmamış listeler böyledir.
Listemizin başında minicik noktalar olur:)

Sırasız liste yapıyoruz:
Sırasız liste <UL> etiketi ile başlar </UL> etiketi ile biter.
Aynı sıralı listelerdeki gibi <li> etiketleri arasına yazılır:
En sevdiğim müzik türleri:
<ul>
<li>POP
<li>Jazz
<li>Modern
</ul>
Bu kodların oluşturduğu sıralı liste aşağıdaki gibidir:
En sevdiğim Müzik türleri:
  • POP
  • Jazz
  • Modern
İçi dolu, İçi Boş ve Kare noktacıklar:

<UL> etiketin yandaki "type" değerinin karşısına "DISC" yazarsak içi dolu dairemiz, "CIRCLE" yazarsak, içi boş dairemiz ve "SQUARE" yazarsak köşeli bir noktamız olur. Şimdi bir örnek verelim:

En sevdiğim müzik türleri:
<ol type="disc">
<li>POP
</ol>
<ol type="circle">
<li>Jazz
</ol>
<ol type="square">
<li>Modern
</ol>

Bu kodların oluşturduğu sıralı liste aşağıdaki gibidir:

En sevdiğim Müzik türleri:

  1. POP
  1. Jazz
  1. Modern
Hem sayılı hem de sıralı listeler:
Bazen de listemizin hem sayı ile listenemesini aynı zamanda da normal bir şekilde listelenmesini isteriz.. Bunun için:
<ol>
<li>En sevdiğim yaz meyveleri:
<u>
<li>Kayısı
<li>Şeftali
<li>Erik
<li>Üzüm
</ul>
<br>
<li>En sevdiğim kış meyveleri:
<ul>
<li>Portakal
<li>Mandalina
<li>Nar
<li>Ayva
</ul>
</ol>
Bu kodların oluşturduğu liste aşağıdaki gibidir:

 

  1. En sevdiğim yaz meyveleri
    • Kayısı
    • Şeftali
    • Erik
    • Üzüm
  2. En sevdiğim Kış meyveleri
    • Portakal
    • Mandalina
    • Nar
    • Ayva
 

Tanımlama Listeleri nasıl yapılır?

Tanımlama listeleri <dl> etikeli ile başlar </dl> etiketi ile biter. Listenin maddeleri <dd> , <dt> etiketleri arasına yazılır.

<dl>
<dt><font size="3" color="red"> En sevdiğim hayvanlar</font>
<dd>Kediler ve kaplumbağalardır. 2 kedim var. Biri beyaz biri sarman. İsimleri ipekpisi ve sütlü... Kaplumbağalarım suda yaşıyan cinsten ve onlar da iki tane...
<dt>En Sevdiğim çiçekler
<dd>Papatyalara bayılırım. Her türlü kır çiçeğini severim. Tabii beyaz gülleri de...
<dt>En sevdiğim yemekler
<dd>Köfte ve pilav başta gelir. Kurufasulye, karnıyarık ve biber dolmasını çok severek yerim
</dl>
Bu kodların oluşturduğu liste aşağıdaki gibidir:
En sevdiğim hayvanlar
Kediler ve kaplumbağalardır. 2 kedim var. Biri beyaz biri sarman. İsimleri ipekpisi ve sütlü... Kaplumbağalarım suda yaşıyan cinsten ve onlar da iki tane...
En Sevdiğim çiçekler
Papatyalara bayılırım. Her türlü kır çiçeğini severim. Tabii beyaz gülleri de...
En sevdiğim yemekler
Köfte ve pilav başta gelir. Kurufasulye, karnıyarık ve biber dolmasını çok severek yerim
 
Sırasız Liste Nasıl Yapılır?

Şimdi de sırasız listeleri öğrenelim. Yani bir sıraya dizilmemiş, numaralandırılmamış listeler böyledir.
Listemizin başında minicik noktalar olur:)

Sırasız liste yapıyoruz:
Sırasız liste <UL> etiketi ile başlar </UL> etiketi ile biter.
Aynı sıralı listelerdeki gibi <li> etiketleri arasına yazılır:
En sevdiğim müzik türleri:
<ul>
<li>POP
<li>Jazz
<li>Modern
</ul>
Bu kodların oluşturduğu sıralı liste aşağıdaki gibidir:
En sevdiğim Müzik türleri:
  • POP
  • Jazz
  • Modern
İçi dolu, İçi Boş ve Kare noktacıklar:

<UL> etiketin yandaki "type" değerinin karşısına "DISC" yazarsak içi dolu dairemiz, "CIRCLE" yazarsak, içi boş dairemiz ve "SQUARE" yazarsak köşeli bir noktamız olur. Şimdi bir örnek verelim:

En sevdiğim müzik türleri:
<ol type="disc">
<li>POP
</ol>
<ol type="circle">
<li>Jazz
</ol>
<ol type="square">
<li>Modern
</ol>

Bu kodların oluşturduğu sıralı liste aşağıdaki gibidir:

En sevdiğim Müzik türleri:

  1. POP
  1. Jazz
  1. Modern
Hem sayılı hem de sıralı listeler:
Bazen de listemizin hem sayı ile listenemesini aynı zamanda da normal bir şekilde listelenmesini isteriz.. Bunun için:
<ol>
<li>En sevdiğim yaz meyveleri:
<u>
<li>Kayısı
<li>Şeftali
<li>Erik
<li>Üzüm
</ul>
<br>
<li>En sevdiğim kış meyveleri:
<ul>
<li>Portakal
<li>Mandalina
<li>Nar
<li>Ayva
</ul>
</ol>
Bu kodların oluşturduğu liste aşağıdaki gibidir:

 

  1. En sevdiğim yaz meyveleri
    • Kayısı
    • Şeftali
    • Erik
    • Üzüm
  2. En sevdiğim Kış meyveleri
    • Portakal
    • Mandalina
    • Nar
    • Ayva
 

Tanımlama Listeleri nasıl yapılır?

Tanımlama listeleri <dl> etikeli ile başlar </dl> etiketi ile biter. Listenin maddeleri <dd> , <dt> etiketleri arasına yazılır.

<dl>
<dt><font size="3" color="red"> En sevdiğim hayvanlar</font>
<dd>Kediler ve kaplumbağalardır. 2 kedim var. Biri beyaz biri sarman. İsimleri ipekpisi ve sütlü... Kaplumbağalarım suda yaşıyan cinsten ve onlar da iki tane...
<dt>En Sevdiğim çiçekler
<dd>Papatyalara bayılırım. Her türlü kır çiçeğini severim. Tabii beyaz gülleri de...
<dt>En sevdiğim yemekler
<dd>Köfte ve pilav başta gelir. Kurufasulye, karnıyarık ve biber dolmasını çok severek yerim
</dl>
Bu kodların oluşturduğu liste aşağıdaki gibidir:
En sevdiğim hayvanlar
Kediler ve kaplumbağalardır. 2 kedim var. Biri beyaz biri sarman. İsimleri ipekpisi ve sütlü... Kaplumbağalarım suda yaşıyan cinsten ve onlar da iki tane...
En Sevdiğim çiçekler
Papatyalara bayılırım. Her türlü kır çiçeğini severim. Tabii beyaz gülleri de...
En sevdiğim yemekler
Köfte ve pilav başta gelir. Kurufasulye, karnıyarık ve biber dolmasını çok severek yerim
 



 
  Bugün 1 ziyaretçi (4 klik) kişi burdaydı! Copyright © By Taylan Yılmaz ®
Bu Sitenin İçerikleri bilgisayardersanesi.com ve bilgisayarhakkinda.com 'dan alıntı yapılmıştır
 
 
Bu web sitesi ücretsiz olarak Bedava-Sitem.com ile oluşturulmuştur. Siz de kendi web sitenizi kurmak ister misiniz?
Ücretsiz kaydol