Tablo Oluşturma

 Web sayfalarımızda tablo oluşturmak için kullanacağımız etiket <table> etiketidir. Tablolar satır ve sütunlardan oluşur. Satır ile sütunun kesiştiği kutuya hücre denir. Dolayısıyla tabloda en az bir tane hücre bulunmalıdır. 

<table> etiketi:

Tablo oluşturmak için kullanılan etikettir. Tablo işlemleri <table> ile başlar, satırlar ve sütunlar yazılır, sonra </table> ile sonlandırılır.

    <tr> etiketi:

Satır oluşturmak için kullanılan etikettir. <tr> ile başlar, sütunlar yazılır yine </tr> ile sonlandırılır.

    <td> etiketi:

sütun (hücre) oluşturmak için kullanılır. <td> ile başlar </td> ile sonlandırılır.

Örnek-1: Tek satır ve tek sütundan, dolayısıyla tek hücreden oluşan bir tablo.

<table> etiketi ile kullanılan bazı parametreler şunlardır.

border      =>    parametresi kenarlık kalınlığını belirler. örnek: <table border="2px"> 

width        =>    parametresi tablonun genişliğini ayarlamamızı sağlar. Aynı parametre hücreler için de kullanılabilir. 

ÖRNEKLER

<table width="400px">  tablonun genişliği 400px olarak belirlendi.

<table width="70%">  tablonun genişliği ekranın yüzde 70'i olarak belirlendi.

<td width="100px">    sütunun genişliği 100px olarak belirlendi.

align    => parametresi ile tabloyu sola, sağa yada sayfanın ortasına hizalayabiliriz.

örnek:    <table align="center"> tablomuz sayfanın ortasına konumlandı.

cellpadding => parametresi hücredeki verilerin, hücre kenarlarıyla olan uzaklığını ayarlar

örnek:    <table border="1" cellpadding="10px"> tablodaki hücrelerin içindeki veriler, kenarları 10px itecek. Dolayısıyla hücreler, normalden daha geniş olacak.

cellpadding uygulaması

cellspacing => parametresi kenar çizgilerinin arasındaki uzaklığı ayarlar.

Örnek: <table cellspacing="5px"> tablo kenarlıklarının arasına 5px boşluk bırakır.

cellspacing değer 0px

cellspacing değeri 5px