HTML Samples - ASP Kod Örnekleri

Trang chủ » Html Hazır Kod örnekleri » HTML Samples - ASP Kod Örnekleri

Có thể bạn quan tâm

HTML Listeler

HTML belgelerinde 3 çeşit liste kullanılmaktadır.

  • 1. Sıralı listeler (ordered list) : Rakam veya harf yada her ikisini içiçe kullanarak oluşturulan listelerdir.
  • 2. Sırasız listeler (unordered list) : Madde işaretleriyle oluşturulan listelerdir.
  • 3. Tanımlama listeleri (definition list) : Liste yerine uzun metinlerin okunmasını kolaylaştıran bir araçtır.

1. Sıralı Listeler (Ordered List)

Sıralı listelemede liste içine alınacak metinler <ol>...</ol> etiketleri arasına alınarak yazılmaktadır. Bu etiketler listenin başladığını ve bittiğini belirtir.

Listenin maddelerinin başına ise <li> (list item) etiketini getirilmektedir. Bu etikette tıpkı <br> etiketi gibi sonlandırılmamaktadır.

<ol> etiketi kullanılırken parametreler eklenebilir. Bu şekilde listenin rakamla mı harfle mi başlayacağı (type) yada hangi rakam/harfle başlayacağı (start) belirlenebilmektedir. Compact parametresi ise listenin mümkün olan minimum satır aralığına sahip olmasını sağlamaktadır.

Aşağıdaki örnek kodları ve sonucunu görelim.

View Code HTML
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 <html> <head> <title>Sıralı Listeler</title> </head> <body> <ol type="1"> <li>Dersler <ol type="a"> <li>Matematik <li>Türkçe </ol> <li>Yabancı Diller <ol type="a"> <li>İngilizce <li>Almanca </ol> <li>İller <ol type="a"> <li>Ankara <li>Samsun <ol type="i"> <li>Atakum <li>Atakent </ol> </ol> </ol> </body> </html>

Yukarıdaki kodları çalıştırdığımızda aşağıdaki pencere ekrana gelir.

Yukarıdaki örneğe dikkat edilirse <ol> etiketi ile başlayıp liste maddelerinin her birisinin başına <li> etiketini getirilmekte, liste bitirilirken </ol> etiketini yazılır. Liste içinde yeni bir liste oluşturulacaksa tekrar <ol> etiketini yazılır. Type parametresi ile maddelerin hangi şekilde başlayacağı belirlenir. (rakam/harf/romen rakamları vb.)

2. Sırasız Listeler (Unordered List)

Sırasız listelerin farkı listeleme yapılırken maddelerin başına harf, rakamlar yerine küçük yuvarlaklar,kareler kullanılabilmesidir. <ol> etiketi yerine <ul> etiketi yazılmaktadır. Maddeler için <li> aynı şekilde kullanılmaktadır. <ol> için parametreler ise; type için disc (içi dolu daire), circle (içi boş daire), square (içi dolu kare). Compact parametresi sırasız listelerde de kullanılabiliyor.

Aşağıdaki örnek kodları ve sonucunu görelim.

View Code HTML
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 <html> <head> <title>Sırasız Listeler</title> </head> <body> <ul type="disc"> <li>Dersler <ul type="square"> <li>Matematik <li>Türkçe </ul> <li>Yabancı Diller <ul type="square"> <li>İngilizce <li>Almanca </ul> <li>İller <ul type="square"> <li>Ankara <li>Samsun <ul type="circle"> <li>Atakum <li>Atakent </ul> </ul> </ul> </body> </html>

Yukarıdaki kodları çalıştırdığımızda aşağıdaki pencere ekrana gelir.

3. Tanımlama Listeleri

Bu listelemede kullanılan etiketleri şu şekildedir.; <dl>...</dl> , <dd>...</dd> , <dt>...</dt>

Listenin maddelerini belirtmek için <li> etiketinin yerine <dd> ve <dt> etiketleri yazılır. Aynı şekilde <ol>...</ol> veya <ul>...</ul> etiketleri arasına aldığımız listede ise <dl>... </dl> etiketleri kullanılır. Yine parametre olarak <dl> etiketi içinde compact ifadesi kullanılmaktadır..

Aşağıdaki örnek kodları ve sonucunu görelim.

View Code HTML
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 <html> <head> <title>Tanımlama Listeleri</title> </head> <body> <font face="verdana" size="4" color="red">Neler öğrendik?</font> <dl compact> <dt><font size="3" color="blue">Listeler nelerdir?</font> <dd><font size="2" color="black">HTML belgelerinde 3 çeşit liste kullanılmaktadır</font> <dt><font size="3" color="blue">Sıralı listeler </font> <dd><font size="2" color="black">Rakam veya harf yada her ikisini içiçe kullanarak oluşturulan listelerdir</font> <dt><font size="3" color="blue">Sırasız listeler </font> <dd><font size="2" color="black">Madde işaretleriyle oluşturulan listelerdir</font> <dt><font size="3" color="blue">Tanımlama listeleri </font> <dd><font size="2" color="black">Liste yerine uzun metinlerin okunmasını kolaylaştıran bir araçtır</font> </dl> </body> </html>

Yukarıdaki kodları çalıştırdığımızda aşağıdaki pencere ekrana gelir.

Từ khóa » Html Hazır Kod örnekleri