Nagłówek
W E B D E S I G N |
przykłady tabel |
<TABLE BORDER="0" CELLSPACING="0" CELLPADDING="10">
<TR>
<TD ALIGN=""right">W E B D E S I G N</TD>
<TD>przykłady tabel</TD>
</TR>
</TABLE>

|
Podział strony na kolumny
<TABLE BORDER="0" CELLSPACING="0" CELLPADDING="10">
<TR>
<TD WIDTH="132" VALIGN="top">1</TD>
<TD WIDTH="18" VALIGN="top">2</TD>
<TD WIDTH="310" VALIGN="top">3</TD>
</TR>
</TABLE>

|
Atrybut VALIGN w kolumnach
top
 |
middle |
bottom |
baseline |
<TABLE BORDER="0" CELLSPACING="0" CELLPADDING="10">
<TR>
<TD VALIGN="top">top</TD>
<TD VALIGN="middle">middle</TD>
<TD VALIGN="bottom">bottom</TD>
<TD VALIGN="baseline">baseline</TD>
</TR>
</TABLE>

|
Dla łatwiejszej orientacji, podczas konstruowania tabeli warto
używać atrybutu BORDER="1", a po skończeniu zmienić na "0" albo zostawić, w zależności od potrzeb.
Atrybuty szerokości i światła ramek
CELLSPACING="0"
CELLPADDING="0" |
CELLSPACING="0"
CELLPADDING="5" |
CELLSPACING="5"
CELLPADDING="0" |
CELLSPACING="5"
CELLPADDING="5" |
<TABLE BORDER="1" CELLSPACING="n" CELLPADDING="n">
<TR>
<TD>CELLSPACING="n"</TD>
</TR>
<TR>
<TD>CELLPADDING="n"</TD>
</TR>
</TABLE>

|
Atrybut COLS
<TABLE COLS="3" BORDER="0" CELLSPACING="n" CELLPADDING="n">
<TR>
<TD>1</TD>
<TD>2</TD>
<TD>3</TD>
</TR>
</TABLE>

|
Atrybut ROWSPAN
0 |
1 |
2 |
3 |
4 |
5 |
6  |
<TABLE BORDER="0" CELLSPACING="0" CELLPADDING="5">
<TR>
<TD ROWSPAN="6">0</TD>
</TR>
<TR>
<TD>1</TD>
</TR>
<TR>
<TD>2</TD>
</TR>
<TR>
<TD>3</TD>
</TR>
<TR>
<TD>4</TD>
</TR>
<TR>
<TD>5</TD>
</TR>
<TR>
<TD>6</TD>
</TR>
</TABLE>

|
Atrybut COLSPAN
<TABLE BORDER="0" CELLSPACING="0" CELLPADDING="5">
<TR>
<TD COLSPAN="2">1</TD>
<TD COLSPAN="4">2</TD>
</TR>
<TR>
<TD>3</TD>
<TD>4</TD>
<TD>5</TD>
<TD>6</TD>
<TD>7</TD>
<TD>8</TD>
</TR>
</TABLE>

|
Ilustracja w tle tabeli

Przeglądarki w wersji od 4.0 umożliwiają oglądanie ilustracji
podłożonej w tle całej tabeli lub w pojedynczej celi. |
<TABLE BACKGROUND="tlo.jpg" BORDER="0" CELLSPACING="0" CELLPADDING="10">
<TR>
<TD>
<IMG WIDTH="170" HEIGHT="193" ALIGN="right" BORDER="0" SRC="mole.gif">
Tekst </TD>
</TR>
</TABLE>

|
<TABLE BORDER="0" CELLSPACING="0" CELLPADDING="10">
<TR>
<TD BACKGROUND="tlo.jpg">
<IMG WIDTH="170" HEIGHT="193" ALIGN="right" BORDER="0" SRC="mole.gif">
Tekst </TD>
</TR>
</TABLE>

|
Pozornie niezauważalne drobiazgi mogą stworzyć ciekawą kompozycję;
tabele z definicjami zakończone są delikatną linią z pikselowego
GIFa. Inny GIF posłużył do zrobienia bloku.
<TABLE WIDTH="440" BGCOLOR="#EEEEEE" BORDER="0" CELLSPACING="0"
CELLPADDING="0">
<TR>
<TD><IMG WIDTH="40" HEIGHT="1" ALIGN="left" SRC="clear.gif">
<TABLE BORDER="0" CELLSPACING="0" CELLPADDING="10">
<TR>
<TD>tekst</TD>
</TR>
</TABLE>
<IMG WIDTH="440" HEIGHT="1" SRC="black.gif"></TD>
</TR>
</TABLE>
 |

|