HTML [ 06 – Tablolar ]

Tablolar

Tablolar <table>. . . . </table> etiketleri arasında oluşturulur. <table> etiketinden sonra daima <tr> gelir. Her satır tanımlandığında <tr>, her hücre tanımlandığında da <td> etiketi kullanılır.

1. hücre 2. hücre 3. hücre
4. hücre 5. hücre 6. hücre

Bağımsız Değişkenler

<table border="" cellpadding="" cellspacing="" width="" height="" bgcolor="" align="" valign="">
<td height="" width="" bgcolor="" align="" valign="" colspan="" rowspan="">

border : Çerçevenin kalınlığını belirler. border=”0″ dersek tabloda çerçeve bulunmaz, bu miktarı arttırdıkça çerçevenin kalınlığı da artar.

cellpadding , cellspacing : Hücre elemanlarının sınırlara olan uzaklığı cellpadding, satır ve sütunların uzaklığı ise cellspacing değişkeni ile belirtilir.

bgcolor: <table bgcolor=”red”> şeklinde kullanarak bütün tablo ya da <td bgcolor= “red”> şeklinde sadece tek bir hücre renklendirilir.

align : Hücredeki elemanın yatay konumunu belirler ve “right, left, center” opsiyonları ile kullanılır.

valign : Hücre elemanının düşey konumunu belirler ve opsiyonları “top, bottom, middle”dır.

colspan , rowspan : Aynı satırdaki hücreleri birleştirmek için colspan, aynı sütundaki hücreleri birleştirmek için de rowspan değişkeni kullanılır. Birleştirilen hücreye ait <td>. . </td> etiketi silinir.

<table border="1">
<tr><td>1. hücre</td><td>2. hücre</td><td>3. hücre</td></tr>
<tr><td rowspan="2">4. hücre</td><td colspan="2">5. hücre</td></tr>
<tr><td>6. hücre</td><td>7. hücre</td></tr>
</table>

1. hücre 2. hücre 3. hücre
4. hücre 5. hücre
6. hücre 7. hücre

Referans;http://www.htmlogren.com/?id=9

 

Leave a Reply

Your email address will not be published. Required fields are marked *