Tablo

Tanım: HTML'de bilgileri satır ve sütünlar şeklinde göstermek için kullanılan yapı. Sayfanın bileşenlerinin genel yerleşimi içinde kullanılmaktadır.

---

Table Element

Tanım: HTML'de satır ve sütunlardan oluşan bilgileri göstermek için kullanılan etiket. Aynı zamanda sayfanın genel yerleşimi içinde kullanılmaktadır.

---

Tr Elementi

Tanım: HTML'de bir tabloya satır eklemek için kullanılan element. Tr , Table Row kelimelerinin kısaltmasıdır.

---

Td Elementi

Tanım: HTML'de bir tablo satırına (tr elementi içine) hücre eklemek için kullanılan element. Td , Tablo Definition kelimelerinin kısaltmasıdır.

---

HTML'de Basit Bir Tablo Örneği

Aşağıda basit bir tablo örneği görülmektedir : 

<table>
	<tr><td> 11 eleman  <td> 12 elemen
	<tr><td> 21 eleman <td> 22 eleman
</table>

Yukarıdaki örnekte 2 satır ve her satırda 2 sütun gözükecektir. 

---

HTML'de Basit Bir Colspan Kullanım Örneği

Aşağıda basit bir colspan kullanım örneği bulunmaktadır : 

<table>
	<tr><td colspan="2">1111<td>12 elemen
	<tr><td>21<td>22
</table>

Yukarıda tablonun ilk sütununun genişliği ikinci sütununun iki katı olacaktır. 

---

HTML'de Basit Bir Rowspan Kullanım Örneği

Aşağıdaki rowspan kullanılan bir örnek görülmektedir : 

<table>
	<tr>
		<td rowspan="4"><img src="test.gif">
		<td>1
	<tr>
		<td>2
	<tr>
		<td>3
	<tr>
		<td>4
</table>

Yukarıdaki örnekte ilk hücredeki resim  , diğer dört hücrenin satır genişliklerinin toplamı kadar gözükecektir. Aşağıdaki gibi gözükecektir : 

	1
	2
	3
	4

 

---

HTML'de Tablo Hücrelerini Birleştirebilirsiniz

HTML'de tablolarda herhangi bir şekilde belirtilmez ise tüm hücrelerin genişlik ve yüksekliği eşit olmaktadır. Eğer bir hücreyi genişlik ve yükseklik olarak diğer hücrelerden daha büyük hale getirmek istiyorsanız rowspan ve colspan kullanabilirsiniz. rowspan bir hücreyi yükseklik olarak birden fazla satır yüksekliğinde yapmak için kullanılabilir . Benzer şekilde colspan'da bir sütun genişliğini birden fazla sütunun genişliği kadar (iki veya daha fazal sütun birleşmiş gibi) olmasını sağlamaktadır. 

Colspan aşağıdaki gibi kullanabilirsiniz : 

11		12
21	22	23

Yukarıdaki yapı aşağıdaki gibi gözükür : 

11		12
21	22	23

Rowspan ise aşağıdaki gibi kullanılabilir : 

11	12
	21

Yukarıdaki yapı aşağıdaki gibi gözükür : 

11	12
	21

 

 

---