HTML Dersleri 8 Listeleme İşaretleri

LİSTELEME İŞARETLERİ

Bu etiketler liste oluşturmak için kullanılır. <ol> dilimizde “sıralı liste” anlamına gelen ordered list kelimelerinin kısaltmasıdır. Sıralı liste oluşturmamıza yarar. <ul> ise dilimizde “sırasız liste” anlamındaki unordered list kelimelerinin kısaltmasıdır. Sırasız liste oluşturmamızı sağlar. <li> ise “liste elemanı” nın kısaltması olan list item kelimelerinin baş harflerini simgeler. Sıralı ya da sırasız listelerdeki elemanları <li> etiketinin içine yazarız. <ul> ve <li> etiketleri sıklıklıkla sitelerin menüleri oluşturulurken kullanılır.

SIRASIZ (MADDE İMLİ) LİSTELER

Sırasız listelerde liste elemanları numaralandırılmaz; bunun yerine çeşitli simgeler ile belirtilirler. Bu simgeler siyah küçük daire, siyah küçük kare veya çember şeklindedir. Sırasız bir liste maddelerden oluşur. Liste içeriği madde imleri ile işaretlenir.

Sırasız listeleme <ul> etiketi ile başlar. Her madde de <li> etiketi ile başlar.

Şimdi örnek kodumuza bakalım…

Çıktımız ise şu şekilde olacaktır…

Sırasız Liste

<ul> etiketinin type niteliğini kullanarak madde iminin görünümünü değiştirebilirsiniz. Sırasız listelerde varsayılan madde imi siyah dairedir. Üç farklı kullanıma ait kod yazımı aşağıdaki gibidir:

<ul type=”square”> <ul type=”disc”> <ul type=”circle”>
     

Çıktımız ise aşağıdaki şekilde olacaktır:

<ul type=”square”> <ul type=”disc”> <ul type=”circle”>

Bir liste madde içerisine paragraflar, resimler, linkler, başka listeler ve satır boşlukları koyabilirsiniz.

SIRALI (NUMARALI) LİSTELER

Sıralı Listelerde liste elemanları numaralandırılır ve bu numara 1’den başlayarak her liste elemanında 1 artırılır. Sıralı listeler <ol> etiketi ile (ordered list) oluşturulur. Maddeler rakamlar ile listelenir.

Sıralı listeleme <ol> etiketi ile başlar. Her madde de <li> etiketi ile başlar.

Şimdi örnek kodumuza bakalım…

Çıktımız ise şu şekilde olacaktır…

Sıralı Liste

<ol> etiketinin type niteliğini kullanarak sıra numarasının biçimini değiştirebilirsiniz. Sıralı listelerde varsayılan biçim pozitif tamsayılardır.

Burada kullanılabilecek beş seçenekten her birinin görünümü aşağıdaki tabloda verilmiştir.

 <ol type=”I”>  <ol type=”i”>  <ol type=”A”>
     
 <ol type=”a”>  <ol type=”1”>
   

Çıktımız ise aşağıdaki şekilde olacaktır:

 <ol type=”I”>  <ol type=”i”>  <ol type=”A”>
     
 <ol type=”a”>  <ol type=”1”>
   

TANIMLAMA LİSTELERİ

Bir tanımlama listesi maddelerin sıralanması demek değildir. Bu, terimlerin açıklanması demektir.

Bir tanımlama listesi <dl> etiketi ile başlar. Her terim <dt> etiketi ile başlar. Her terimin tanımlaması da <dd> etiketi ile başlar.

Örnek kodlarımıza bakalım…

Çıktımız ise şu şekilde olacaktır…

Tanımlama Etiketi

Bir tanımlama listesi içerisine paragraflar, resimler, linkler, başka listeler ve satır boşlukları vs. koyabilirsiniz.

LİSTELEME ETİKETLERİ  
 ETİKET AÇIKLAMA 
 <ol>  Sıralı liste.
 <ul>  Sırasız liste.
 <li>  Liste maddesi.
 <dl> Tanımlama listesi.
 <dt> Terim tanımı.
 <dd> Tanım açıklaması.

Bu dersimizde de listeleme etiketlerini tanıdık ve öğrenmiş olduk. Gelecek dersimizde HTML Formlar konusunu göreceğimiz. Bir sonraki dersimizde görüşmek üzere…

About egitimkanalim.com

Check Also

HTML Dersleri 15 HTML 5 Media Etiketleri

YENİ ETİKETLER VE ANLAMSAL WEB HTML 5 ile gelen ActiveX, Flash Player, Quicktime gibi web …

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir