Html Dersleri – 3 (Listeleme ve Tablo)
Merhabalar..
Html’de listeleme dediğimiz şey bildiğiniz üzere Word’deki listelemenin aynısıdır.
Örn:
Peki biz bunu html de nasıl yapacağız? Bunun için <ul> <ol> ve <li> etiketlerimiz var..
ul : Genellikle sıralama niteliğine sahip olmayan öğeler için kullanılır.
ol : Genellikle sıralama, dizilim yapılan içeriklerin listelenmesi için kullanılır.
li : ul ya da ol içinde yer alan listenin her bir öğesini kapsar.
type: Listeleme şekillerini belirler..
type: disc = İçi dolu bir daire görüntüler
type: circle = İçi boş bir daire görüntüler
type: square = İçi dolu ya da boş bir kare görüntüler
Bu örnekte en basit kullanımı inceleyebilirsiniz.
<ol> <li>İlk içerik</li> <li>İkinci içerik</li> <li>Üçüncü içerik</li> </ol>
Daha detaylı görelim..
<ol type="i"> <li> Birinci öğe...</li> <li> İkinci öğe ... <ul type="square"> <li>İkinci öğenin bir öğesi... <li>İkinci öğenin başka bir öğesi... </ul> </li> <li> Üçüncü öğe...</li> </ol>
Sonuç:
İleride Css kullanarak ul ve li sayesinde yan menü açılır menü vb. menüler oluşturabileceğiz..
Tablo
Word de bildiğimiz tablo yapısıdır. Kod yapısı:
<table> <tr> <td>
table : tablo kodu
tr: satır kodu
td: sütun kodu
Örneğimiz:
Border = Kenarlık –> 1 pixel
<table border="1"> <tr> <td>1. Satırın 1. Hücresi</td> <td>1. Satırın 2. Hücresi</td> <td>1. Satırın 3. Hücresi</td> </tr> <tr> <td>2. Satırın 1. Hücresi</td> <td>2. Satırın 2. Hücresi</td> <td>2. Satırın 3. Hücresi</td> </tr> </table>
Ekran Görüntüsü