Rowspan-kenmerk

Die kenmerk rowspan beheer die samenvoeging van rye in 'n HTML tabel. Word toegepas op die tags th en td.

Aanvaarde waarde: heelgetal beginnend vanaf 1.

Hoe om te gebruik: voeg hierdie kenmerk by enige sel td of th. As, byvoorbeeld, rowspan ingestel word op die waarde 2 - dan sal die sel waaraan dit toegeken is, twee rye in die tabel se hoogte beslaan. In hierdie geval sal die selle van die ry onder nie verdwyn nie, ons uitgebreide sel sal hulle verdring en die tabel sal uitmekaar val. Om dit te voorkom, moet een van die selle uit die ry onder verwijder word. Sien die voorbeelde vir 'n beter begrip.

Voorbeeld . Tabel sonder samenvoegings

Kom ons kyk na 'n tabel sonder samenvoegings, waarmee ons verder sal werk:

<table>
	<tr>
		<td>sel1</td>
		<td>sel2</td>
		<td>sel3</td>
	</tr>
	<tr>
		<td>sel4</td>
		<td>sel5</td>
		<td>sel6</td>
	</tr>
	<tr>
		<td>sel7</td>
		<td>sel8</td>
		<td>sel9</td>
	</tr>
</table>

table, td, th {
	border: 1px solid black;
}

Voorbeeld . Laat ons die sel oor twee rye uitbrei

Laat ons nou sel 1 oor twee rye uitbrei deur die kenmerk rowspan op die waarde 2 te stel. Ons sal sien dat dit die selle uit die ry onder dit verdring en die tabel uitmekaar val:

<table>
	<tr>
		<td rowspan="2">sel1</td>
		<td>sel2</td>
		<td>sel3</td>
	</tr>
	<tr>
		<td>sel4</td>
		<td>sel5</td>
		<td>sel6</td>
	</tr>
	<tr>
		<td>sel7</td>
		<td>sel8</td>
		<td>sel9</td>
	</tr>
</table>

table, td, th {
	border: 1px solid black;
}

Voorbeeld . Laat ons die sel uitbrei sonder dat die tabel uitmekaar val

Om die probleem met die tabel wat uitmekaar val van die vorige voorbeeld reg te stel, laat ons probeer om een van die selle uit die tweede ry te verwijder (en dit is nie noodwendig sel 4 wat direk onder ons sel 1 is nie, enige een kan verwijder word, ons sal sel nommer 5 verwijder):

<table>
	<tr>
		<td rowspan="2">sel1</td>
		<td>sel2</td>
		<td>sel3</td>
	</tr>
	<tr>
		<td>sel4</td>
		<td>sel6</td>
	</tr>
	<tr>
		<td>sel7</td>
		<td>sel8</td>
		<td>sel9</td>
	</tr>
</table>

table, td, th {
	border: 1px solid black;
}

Voorbeeld . Laat ons die sel oor `3` rye uitbrei

En hier laat ons ons sel nie oor twee rye uitbrei nie, maar oor 3, laat ons dit rowspan op die waarde 3 stel. In hierdie geval sal ons een van die selle uit die derde ry verwijder (sel 7, 8 of 9 - maak nie saak nie), sodat die tabel nie uitmekaar val nie:

<table>
	<tr>
		<td rowspan="3">sel1</td>
		<td>sel2</td>
		<td>sel3</td>
	</tr>
	<tr>
		<td>sel4</td>
		<td>sel6</td>
	</tr>
	<tr>
		<td>sel7</td>
		<td>sel9</td>
	</tr>
</table>

table, td, th {
	border: 1px solid black;
}

Voorbeeld . Laat ons nog met `2` kolomme uitbrei

Laat ons ook sel 2 oor 2 kolomme uitbrei as aanvulling tot die eerste sel. Vir hierdie doel voeg ons colspan by sel 2 op die waarde 2. In hierdie geval sal ons sel 3 verwijder, sodat die tabel nie uitmekaar val nie:

<table>
	<tr>
		<td rowspan="3">sel1</td>
		<td colspan="2">sel2</td>
	</tr>
	<tr>
		<td>sel4</td>
		<td>sel6</td>
	</tr>
	<tr>
		<td>sel7</td>
		<td>sel9</td>
	</tr>
</table>

table, td, th {
	border: 1px solid black;
}

Sien ook

die kenmerk colspan,
wat tabelkolomme saamvoeg