Tabele#

Wyrównanie zawartości tabeli#

Wyrównanie zawartości całego wiersza:

  1. —
  2. L
  3. K
  4. T'
  5. T
  6. A
  7. O
  8. Z'
  9. Z
  10. #
<table>
	<tr align="rodzaj" vlign="ustawienie">...</tr>
	...
</table>

Wyrównanie zawartości pojedynczej komórki:

  1. —
  2. L
  3. K
  4. T'
  5. T
  6. A
  7. O
  8. Z'
  9. Z
  10. #
<table>
	<tr>
		<th align="rodzaj" vlign="ustawienie">...</th>
		<td align="rodzaj" vlign="ustawienie">...</td>
	</tr>
	...
</table>

gdzie w obu przypadkach należy podać:

rodzaj
  • left - wyrównanie zawartości wiersza lub komórki do lewej (domyślnie dla td)
  • right - wyrównanie zawartości wiersza lub komórki do prawej
  • center - wyśrodkowanie zawartości wiersza lub komórki (domyślnie dla th)
ustawienie
  • top - ustawienie zawartości wiersza lub komórki na górze
  • bottom - ustawienie zawartości wiersza lub komórki na dole
  • middle - ustawienie zawartości wiersza lub komórki na środku (domyślnie dla td i th)

Polecenia pozwalają określić położenie zawartości całego wiersza tabeli lub pojedynczej komórki. W przykładach zaprezentuję alternatywne polecenia CSS.

Prosty przykład manewrowania zawartością całego wiersza:

  1. —
  2. L
  3. K
  4. T'
  5. T
  6. A
  7. O
  8. Z'
  9. Z
  10. #
<table border="1" style="width: 600px; height: 300px;">
	<tr>
		<td>Domyślne</td>
		<td>Domyślne</td>
		<td>Domyślne</td>
	</tr>
	<tr style="text-align: right; ">
		<td>align="right"</td>
		<td>align="right"</td>
		<td>align="right"</td>
	</tr>
	<tr style="text-align: center; ">
		<td>align="center"</td>
		<td>align="center"</td>
		<td>align="center"</td>
	</tr>
	<tr style="vertical-align: top; ">
		<td>valign="top"</td>
		<td>valign="top"</td>
		<td>valign="top"</td>
	</tr>
	<tr style="vertical-align: bottom; ">
		<td>valign="bottom"</td>
		<td>valign="bottom"</td>
		<td>valign="bottom"</td>
	</tr>
</table>

Efekt:

DomyślneDomyślneDomyślne
align="right"align="right"align="right"
align="center"align="center"align="center"
valign="top"valign="top"valign="top"
valign="bottom"valign="bottom"valign="bottom"

Przykład manewrowania zawartością poszczególnych komórek:

  1. —
  2. L
  3. K
  4. T'
  5. T
  6. A
  7. O
  8. Z'
  9. Z
  10. #
<table border="1" style="width: 600px; height: 300px;">
	<tr>
		<th>Domyślne</th>
		<td>Domyślne</td>
	</tr>
	<tr>
		<th style="text-align: right; ">align="right"</th>
		<td style="text-align: center; ">align="center"</td>
	</tr>
	<tr>
		<th style="vertical-align: top; ">valign="top"</th>
		<td style="vertical-align: bottom; ">valign="bottom"</td>
	</tr>
</table>

Efekt:

DomyślneDomyślne
align="right"align="center"
valign="top"valign="bottom"
Pasek społecznościowy

SPIS TREŚCI AKTUALNEJ STRONY

Tabele (H1) Wyrównanie zawartości tabeli (H2)