HTML'de Tablo

Tablolar

HTML elemanları:

<TABLE> ... </TABLE> - Tablo başı ve sonu
<TR ...> ... </TR > - Tablo içindeki satırlar
<TD ...> ... </TD> - Hücreler
<TH ...> ... </TH> - Tablo başlığı hücresi
<CAPTION ...> ... </CAPTION > - Tablo tanıtıcı yazısı
<THEAD> ... </THEAD> - Tablonun başlığı
<TBODY> ... </TBODY> - Tablonun gövdesi
<TFOOT> ... </TFOOT> - Tablo altbaşlığı
<COLGROUP> ... </COLGROUP> - Kolon gruplarının hizalaması
<COL> ... </COL> - Tek bir kolonun hizalaması
<TABLE BACKGROUND="..."> - Tablonun arkaplan resmi
<TH BACKGROUND="..."> - Tablo başlığı için arkaplan resmi
<TD BACKGROUND="..."> - Hücre için arkaplan resmi
<TABLE FRAME="..."> - Tablo çerçevesinin görünüşü
<TABLE RULES="..."> - Tablo çizgilerinin görünüşü

İçinde hiçbir veri bulunmayan hücrelerin sınırları ekranda görüntülenmez. Bu durumlarda sınırların görünmesi için, hücre içine boş bir satır ya da non-breaking space yerlerştirilir. (<TD>  </TD> ya da <TD> <BR> </TD>)

<TABLE> ... </TABLE>

Tablonun başını ve sonunu belirler. Tablonun oluşması için gereklidir, çünkü diğer tablo elemanları bu elemanın içinde olmadan işlem görmezler. Default olarak tabloların sınırları yoktur. Sınırlar BORDER parametresi ile verilir. Parametreleri;

BORDER

Kullanıldığında, atanan değer tablonun bütün sınırları için geçerli olur. Kullanılmadığında ise tablonu biçbir sınırı olmaz. Fakat kolonlar arasında sınırlar için belli bir alan bırakılır. Bunun anlamı sınırlı genişlikleri ya da sınırsız genişlikleri aynıdır.

BORDER=değer

CELLSPACING ve CELLPADDING

CELLSPACING tTablo içindeki hücrelerin arasındaki boşluğu belirler.

Hücrenin sınırı ile metin arasındaki uzaklığı verir.

<TABLE BORDER=0 CELL SPACING=0 CELL PADDING=0>

Olabilecek en sıkışık tablo biçimidir.

WIDTH ve HEIGHT

Widt: Tablonun istenen genişliğini belirtir. Belge genişliğinin yüzdesi ya da tam pixel olarak verilebilir. <TH> ve <TD> elemanları içinde de kullanılır.

Tablonun istenen yüksekliğini belirtir. Belge genişliğinin yüzdesi ya da tam pixel olarak verilebilir. <TH> ve <TD> elemanları içinde de kullanılır.

ALIGN ve VALIGN (Internet Explorer)

Align:Tabloyu sağa ya da sola hizalamak için kullanılır. Bu parametrenin kullanılması, metnin tablonun etrafına sarılmasını da sağlar.

Valign:Tablo içindeki yazıların dikey hizasını belirler. top yada bottom değerlerini alabilir.

BGCOLOR (Internet Explorer)

Belirli renk adları ya da rrggbb tripleti ile tablonun arkaplan rengini belirler.

BORDERCOLOR (Internet Explorer)

Tablonun sınır rengini belirli renk adları ya da rrggbb tripleti ile belirler. Ancak bu parametrenin çalışabilmesi için, daha önceden BORDER parametresi ile bir sınır değeri verilmiş olmalıdır.

BORDERCOLOR (Internet Explorer)

BORDERCOLORLIGHT (Internet Explorer)

Üç boyutlu görüntüye sahip açık renkli tablo sınırları oluşturmayı sağlar. Belirli renk adları ya da rrggbb tripleti ile değer atanabilir. Ancak bu parametrenin çalışabilmesi için, daha önceden BORDER parametresi ile bir sınır değeri verilmiş olmalıdır.

BORDERCOLORDARK (Internet Explorer)

Üç boyutlu görüntüye sahip koyu renkli tablo sınırları oluşturmayı sağlar. Belirli renk adları ya da rrggbb tripleti ile değer atanabilir. Ancak bu parametrenin çalışabilmesi için, daha önceden BORDER parametresi ile bir sınır değeri verilmiş olmalıdır.

BGCOLOR, BORDERCOLOR, BORDERCOLORLIGHT ve BORDERCOLORDARK parametreleri, <TH>, <TR> ve <TD> elemanları için de kullanılabilir.

BACKGROUND (Internet Explorer)

Tablo elemanı içindeki resimlerin hizalamasını ayarlar.

FRAME (Internet Explorer)

Tablonun dış sınırlarının görüntülenmesini etkiler. Çalışabilmesi için BORDER parametresinin kullanılmış olması gerekir.

void: Tüm dış sınırları kaldırır.
above: Yalnızca tablonun başındaki sınırları görüntüler.
below: Yalnızca tablonun sonundaki sınırları görüntüler.
hsides: Yalnızca yatay olan dış sınırları görüntüler.
lhs: Tablonun sol kenarındaki sınırları görüntüler.
rhs: Tablonu sağ kenarındaki sınırları görüntüler.
vsides: Yalnızca dikey olan dış sınırları görüntüler.
box: Tablonu etrafında bir çerçeve çizer.

RULES (Internet Explorer)

Tablonun içindeki sınırların görüntülenmesini etkiler. Çalışabilmesi için BORDER parametresinin kullanılmış olması gerekir.

none: Bütün iç sınırları kaldırır.
basic: Yalnızca <THEAD>, <TBODY> ve <TFOOT> elemanları arasındaki sınırları görüntüler.
rows: Yatay sınırları görüntüler.
cols: Dikey sınırları görüntüler.
all: Bütün iç sınırları görüntüler.

<TR> ... </TR>

Her tablo satırı için kullanılır. Tablonu içinde kaç tane satır olacağı, kesinlikler kaç tane <TR> elemanı kullanıldığına bağlıdır.

ALIGN ve VALIGN

Align:left, center ya da right değerlerinden birini alarak, değerlerin hücre(ler) içindeki hizalamasını ayarlar.

vALİGN:top, middle, bottom ve baseline değerlrinden birini kullanarak, hücre içindei metinlerin yukarıya, ortaya, aşağıya ya da bütün satır içindeki metnin aynı hizaya getirilmesini sağlar.

BGCOLOR (Internet Explorer)

Belirli renk adları ya da rrggbb tripleti ile satır rengini ayarlamak için kullanılır.

BORDERCOLOR (Internet Explorer)

Belirli renk adları ya da rrggbb tripleti ile satırın sınırlarının rengini ayarlamak için kullanılır.

BORDERCOLORLIGHT (Internet Explorer)

Belirli renk adları ya da rrggbb tripleti ile satırın sınırlarına açık renk üç boyutlu bir görünüş vermek için kullanılır.

BORDERCOLORDARK (Internet Explorer)

Belirli renk adları ya da rrggbb tripleti ile satırın sınırlarına koyu renk üç boyutlu bir görünüş vermek için kullanılır.

<TD ...> ...</TD>

atırların içindeki hücreleri tanımlar. Her satırda aynı sayıda hücre olmasına gerek yoktur. Eksik hücreler, sağ taraftan boş olarak görüntülenirler. Her hücre, HTML belgesinin <BODY> elemanı içinde kullanılabilen bütün elemanlarını içerebilir. Default metin hizalaması sola ve ortadır.

ALIGN ve VALIGN

Align:Hücrenin içindeki metnin (verinin) sola (left), sağa (right) ya da ortaya (center) hizalanmasını sağlar.

Hücrenin içindeki verinin yukarıya (top), ortaya (middle), aşağıya (bottom) ya da bütün satırın ortak hizasına (baseline) yerleştirilmesini sağlar.

WIDTH ve HEIGHT

Width:Hücre genişliğini yüzde ya da kesin pixel ölçüsü olarak belirler.

Height:Hücre yüksekliğini yüzde ya da kesin pixel ölçüsü olarak belirler.

NOWRAP

Hücre içindeki verilerin satır kesmesi verilerek sıkıştırılamayacağını belirtir. Bu parametre kullanıldığında gerçekten çok geniş hücrelere sahip olunabilir. Bu nedenle dikkatli kullanılmalıdır.

BGCOLOR (Internet Explorer)

Hücrenin arkaplan rengini ayarlar.

BORDERCOLOR (Internet Explorer)

Hücrenin sınır rengini belirler.

BORDERCOLORLIGHT (Internet Explorer)

Hücrenin sınırlarına açık renk üç boyutlu görüntü verir.

BORDERCOLORDARK (Internet Explorer)

Hücrenin sınırlarına koyu renk üç boyutlu görüntü verir.

BACKGROUND (Internet Explorer)

Hücrenin arkaplan resmini tanımlar.

<CAPTION...> ... </CAPTION>

Tablonun açıklayıcı başlığını tanımlar. Bu başlık tabloyu yatay olarak ortalar.

ALIGN ve VALIGN

Align:Başlığın tablonun üstünde ya da altında yer almasını sağlar. Default olarak top değerini alarak satırın yukarısında yer alır. top değerinden başka bottom değerini alarak satırın altında yer alabilir. Bunlardan başka Internet Explorer left, center ve right değerlerini destekler

top ve bottom değerlerinden birini alarak, başlığın tablonun üstünde ya da altında yer alması sağlanır.

<THEAD> ... </THEAD>

Yalnız Internet Explorer tarayıcısının desteklediği bu eleman tablonun üst başlık alanını belirlemek için kullanılır.

<TBODY> ... </TBODY>

Yalnız Internet Explorer tarayıcısının desteklediği bu eleman tablonun asıl gövde alanını belirlemek için kullanılır.

<TFOOT> ... </TFOOT>

Yalnız Internet Explorer tarayıcısının desteklediği bu eleman tablonun alt başlık alanını belirlemek için kullanılır.

<COLGROUP> ... </COLGROUP>

Yalnız Internet Explorer tarayıcısının desteklediği bu eleman tablo kolonlarının grup olarak hizalanmasını sağlamak için kullanılır.

ALIGN="center|justify|left|right"

Kolon grubunun metin yatay hizalamasını belirler. Default olarak center değerini taşır.

VALIGN="baseline|bottom|middle|top"

Kolon grubunun metin dikey hizalamasını belirler.

SPAN

ALIGN ve VALIGN parametrelerinin etkileyeceği kolon sayısını verir.

<COL> ... </COL>

Yalnız Internet Explorer tarayıcısının desteklediği bu eleman tablo kolonlarının hizalanmasını sağlamak için kullanılır.

ALIGN="center|justify|left|right"

Kolonun metin yatay hizalamasını belirler. Default olarak center değerini taşır.

SPAN

ALIGN parametresinin etkileyeceği kolon sayısını verir.