Html' de Hücre Birleştirme Örneği

Örnek: Aşağıdaki tabloyu oluşturalım.

Tabloya baktığımızda, her satırda 3 hücre olduğunu göreceğiz; ancak 3. hücreyi ilk satırda dikeyde 3 hücre birleştirmesiyle oluşturacağımız için 2. ve 3. satırda iki hücre oluşturacağız.
2. satırdaki ilk hücrede de 2 dikey hücre birleştirme yapılmıştır ve 3. satırda tekrar oluşturulmaz.
Dördüncü satırda ise yatayda 3 hücre birleştirildiğinden bir <td> kullanıp, 3 hücre birleştirmesi yapacağız.

Tablo Hücre Birleştirme Örneği

Kodlar:

	<html>
	<head>
	</head>
	<body>

	<table align="center" bordercolor="darkblue" border="1" width="250" height="400">
	<tr>
	<td align="center" bgcolor="green">A </td>
	<td align="center" bgcolor="gray">B</td>
	<td align="center" rowspan="3" bgcolor="darkred">F</td>
	</tr>
	<tr>
	<td align="center" rowspan="2" bgcolor="red">C</td>
	<td align="center" bgcolor="yellow">D</td>
	</tr>
	<tr>
	<td align="center" bgcolor="orange">E</td>
	</tr>
	<tr>
	<td align="center" colspan="3" bgcolor="cyan">MALİ</td>
	</tr>
	</table>
	</body>
	</html>

Öne Çıkan Yayın