Tabele#

Zagnieżdżanie tabel#

Tabele są elementami blokowymi, które można zagnieżdżać (czyli umieszczać jedne wewnątrz drugich). Tabele podrzędne należy umieszczać wewnątrz komórek (td, th) tabeli nadrzędnej.

Prosty przykład:

  1. L
  2. K
  3. T'
  4. T
  5. A
  6. O
  7. Z'
  8. Z
  9. #
<table border="3" cellspacing="10" width="500">
	<tr>
		<td>komórka1</td>
		<td>komórka2</td>
		<td>komórka3</td>
	</tr>
	<tr>
		<td>komórka4</td>
		<td>komórka5</td>
		<td>komórka6</td>
	</tr>
	<tr>
		<th>komórka7
			<table border="1" cellspacing="5">
				<tr>
					<td>7-1</td>
					<td>7-2</td>
					<td>7-3</td>
				</tr>
				<tr>
					<td>7-4</td>
					<td>7-5</td>
					<td>7-6</td>
				</tr>
			</table>
		</th>
		<td>komórka8</td>
		<td>komórka9
			<table border="1" cellspacing="5">
				<tr>
					<td>9-1</td>
					<td>9-2</td>
					<td>9-3</td>
				</tr>
				<tr>
					<td>9-4</td>
					<td>9-5</td>
					<td>9-6</td>
				</tr>
			</table>
		</td>
	</tr>
</table>

Efekt:

komórka1komórka2komórka3
komórka4komórka5komórka6
komórka7
7-17-27-3
7-47-57-6
komórka8komórka9
9-19-29-3
9-49-59-6

Możliwość zagnieżdżania tabel przez wielu webmasterów wykorzystana została do tworzenia przeróżnych efektów graficznych (a nawet do budowania całych layotów stron WWW):

  1. L
  2. K
  3. T'
  4. T
  5. A
  6. O
  7. Z'
  8. Z
  9. #
<table style="background-color: black;" cellspacing="0" cellpadding="5">
<tr>
<td>
	<table style="background-color: maroon;" cellspacing="0" cellpadding="5">
	<tr>
	<td>
		<table style="background-color: red;" cellspacing="0" cellpadding="5">
			<tr>
			<td>
				<table style="background-color: yellow;" cellspacing="0" cellpadding="5">
				<tr>
				<td>
					<table style="background-color: white;" cellspacing="0" cellpadding="5">
					<tr>
					<td>5 kolejno zagnieżdżonych tabelek</td>
					</tr>
					</table>
				</td>
				</tr>
				</table>
			</td>
			</tr>
			</table>
		</td>
	</tr>
	</table>
</td>
</tr>
</table>

Efekt:

5 kolejno zagnieżdżonych tabelek

Nie jest to prawidłowa technika (tabele są stosowane niezgodnie z ich przeznaczeniem). Należy się wystrzegać tego typu udziwnień. Arkusze stylów oferują zdecydowanie większe możliwości sterowania wyglądem strony oraz poszczególnych jej elementów.

Pasek społecznościowy

SPIS TREŚCI AKTUALNEJ STRONY

Tabele (H1) Zagnieżdżanie tabel (H2)