TABLOLAR (TABLE) - Web Kursu

Metinleri listelerin yanısıra tablolar yardımıyla da düzenleyebiliriz. Sörf yaparken rastladığınız sayfalar çoğunlukla iç içe geçmiş tablolardan oluşur. Bu nedenle iyi bir sayfa tasarlamak için tablolara hakim olmak gereklidir.

Tablolar <table>...</table> etiketleri arasına yazılır.<tr> etiketi bir yatay sıra oluşturulur, bu yatay sıra istenilen sayıda <td> etiketiyle hücrelere bölünür.Aşağıdaki örneğe bakarak tablo mantığını anlayabilirsiniz.

Hücre1	Hücre2	Hücre3
Hücre4	Hücre5	Hücre6

<tr>

<td >Hücre1</td>
<td >Hücre2</td>
<td >Hücre3</td>

</tr>
<tr>
<td>Hücre4</td>
<td>Hücre5</td>
<td>Hücre6</td>
</tr>

</table>

10/1. <TABLE> ETİKETİ VE PARAMETRELERİ

Burada width ve height parametrelerini aynen daha önce kullandığınız gibi kullanabilirsiniz...

bgcolor

Hücrenin içinin rengini belirler.

<table>
<tr>
<td>Hücre</td>
</tr>
</table>

Hücre

background

Hücre içine resim koyar.

<table background="deneme.gif">
<tr>
<td>Hücre</td>
</tr>
</table>

Hücre

border

Hücre etrafına yerleştireceğiniz çerçevenin kalınlığını belirler

<table border="5">
<tr>
<td>Hücre</td>
</tr>
</table>

Hücre

bordercolor

Çerçeve rengini belirler

<table border="5" bordercolor="teal">
<tr>
<td>Hücre</td>
</tr>
</table>

Hücre

bordercolorlight

Çerçevenin sol ve üst kenarlarının rengini belirler

<table border="5" bordercolorlight="aqua">
<tr>
<td>Hücre</td>
</tr>
</table>

Hücre

bordercolordark

Çerçevenin sağ ve alt kenarlarının rengini belirler.

<table border="5" bordercolordark="blue">
<tr>
<td>Hücre</td>
</tr>
</table>

Hücre

align

Hücrenin yatay konumu belirler

<table align="right">
<tr>
<td>Hücre</td>
</tr>
</table>

Hücre

cellspacing

Hücre etrafındaki çerçevenin kalınlığını belirler.

<table border="1" cellspacing="10">
<tr>
<td>Hücre</td>
</tr>
</table>

Hücre

cellpadding

Hücre içindeki elemanların (metin, resim, vs.) çerçeveden uzaklığını belirler.

<table border="1" cellpadding="10">
<tr>
<td>Hücre</td>
</tr>
</table>

Hücre

Sonraki konu: Tablolar 2