Bir HTML dosyasında tablo oluşturmak için 3 temel kodu bilmemiz yeterli:

KodAnlamı
<table>Tabloya başlamak.
<tr>Satıra başlamak.
<td>Sütuna başlamak.

See the Pen EJveBN by Html Tasarim (@htmltasarim) on CodePen.0

Burada dikkat edilmesi gereken birkaç nokta var. Birincisi mutlaka satırlardaki sütun sayıları eşit olmalıdır. Eğer iki sütunu birleştireceksek colspan=”” ya da iki satırı birleştireceksek rowspan=”” özelliğini td kodu içerisinde kullanarak tırnak işareti arasına kaç sütun ya da satır birleştiğini yazmamız gereklidir.

See the Pen OGjoea by Html Tasarim (@htmltasarim) on CodePen.0

Dikkat edilirse rowspan=”2″ kullandığımız satırdan sonra sadece tek sütun kullandık. Bu da satır 3, sütun 2‘yi oluşturdu. Bu sayılarda yapacağınız yanlışlık tabloda görünümde sorunlar çıkaracaktır.

Tablo Özellikleri

ÖzellikAnlamı
border=”0″Tablo kenarlığı boyutu.
cellspacing=”0″Sütunlar arası kenarlık boşluğu.
cellpadding=”0″Satırlar arası kenarlık boşluğu.
width=”genislik”Tablo genişliği. Piksel ya da yüzde olarak ifade edilebilir.
class=”stil”Tablo stili belirtilebilir (CSS bölümünde açıklanıyor).

TD (Sütun) Özellikleri

ÖzellikAnlamı
align=”hiza”Kutu hizası, left, right, center kullanılabilir.
width=”genislik”Tablo genişliği. Piksel ya da yüzde olarak ifade edilebilir.
height=”yukseklik”Tablo yüksekliği. Piksel ya da yüzde olarak ifade edilebilir.
class=”stil”Tablo stili belirtilebilir (CSS bölümünde açıklanıyor).

NOT: Eğer bir sütuna hiçbir şey yazmadan boş bırakırsak sütun görünmeyecektir. Bu sorunu çözmek için &nbsp; kullanarak kutuda boşluk karakterine yer verirseniz kenarlıkların göründüğünü göreceksiniz.