







 |
Uma tabela constitui-se da tag: <table>
(tabela), cujos dados dever�o estar contidos nas tags <tr>
(table row, linha) e <td> (table data,
c�lula de dados) ou <th> (table
heading/header, c�lula de cabe�alho). A tag <caption>
(legenda, cabe�alho, t�tulo) � opcional.
Exemplo de tabela simples com t�tulo, 3 linhas e 3 colunas,
sendo que a 1a. linha e a 1a. coluna cont�m cabe�alhos:
T�tulo da Tabela
| |
Coluna 1 |
Coluna 2 |
| Linha 1 |
C�lula Lin1-Col1 |
C�lula Lin1-Col2 |
| Linha 2 |
C�lula Lin2-Col1 |
C�lula Lin2-Col2 |
Atributos: width, height,
cellspacing, cellpadding, bgcolor,
border, bordercolor, bordercolorlight e
bordercolordark:
O atributo width refere-se �
largura da tabela. Exemplo com width="200"
| |
Coluna 1 |
Coluna 2 |
| Linha 1 |
C�lula Lin1-Col1 |
C�lula Lin1-Col2 |
| Linha 2 |
C�lula Lin2-Col1 |
C�lula Lin2-Col2 |
O atributo height refere-se �
altura da tabela. Exemplo com height="200"
| |
Coluna 1 |
Coluna 2 |
| Linha 1 |
C�lula Lin1-Col1 |
C�lula Lin1-Col2 |
| Linha 2 |
C�lula Lin2-Col1 |
C�lula Lin2-Col2 |
O atributo cellspacing
refere-se ao espa�amento entre as c�lulas da tabela.
Exemplo com cellspacing="9"
| |
Coluna 1 |
Coluna 2 |
| Linha 1 |
C�lula Lin1-Col1 |
C�lula Lin1-Col2 |
| Linha 2 |
C�lula Lin2-Col1 |
C�lula Lin2-Col2 |
O atributo cellpadding
refere-se ao espa�amento entre o texto e a borda da
c�lula. Exemplo com cellpadding="9"
| |
Coluna 1 |
Coluna 2 |
| Linha 1 |
C�lula Lin1-Col1 |
C�lula Lin1-Col2 |
| Linha 2 |
C�lula Lin2-Col1 |
C�lula Lin2-Col2 |
O atributo bgcolor refere-se �
cor da tabela. Exemplo com bgcolor="green"
| |
Coluna 1 |
Coluna 2 |
| Linha 1 |
C�lula Lin1-Col1 |
C�lula Lin1-Col2 |
| Linha 2 |
C�lula Lin2-Col1 |
C�lula Lin2-Col2 |
O atributo opcional border
refere-se � espessura da borda e seu valor default = 0
(borda n�o existente). Exemplo de tabela com border
= "1"
| |
Coluna 1 |
Coluna 2 |
| Linha 1 |
C�lula Lin1-Col1 |
C�lula Lin1-Col2 |
| Linha 2 |
C�lula Lin2-Col1 |
C�lula Lin2-Col2 |
O atributo bordercolor
refere-se � cor da borda. Exemplo com bordercolor="yellow"
| |
Coluna 1 |
Coluna 2 |
| Linha 1 |
C�lula Lin1-Col1 |
C�lula Lin1-Col2 |
| Linha 2 |
C�lula Lin2-Col1 |
C�lula Lin2-Col2 |
O atributo bordercolorlight
refere-se � cor da borda clara (superior e esquerda) da
tabela. Exemplo com bordercolorlight="cyan"
| |
Coluna 1 |
Coluna 2 |
| Linha 1 |
C�lula Lin1-Col1 |
C�lula Lin1-Col2 |
| Linha 2 |
C�lula Lin2-Col1 |
C�lula Lin2-Col2 |
O atributo bordercolordark refere-se
� cor da borda escura (inferior e direita) da tabela.
Exemplo com bordercolordark="red"
| |
Coluna 1 |
Coluna 2 |
| Linha 1 |
C�lula Lin1-Col1 |
C�lula Lin1-Col2 |
| Linha 2 |
C�lula Lin2-Col1 |
C�lula Lin2-Col2 |
O atributo
align
refere-se � posi��o do t�tulo em rela��o � tabela e pode
ter os valores "top" ou "bottom":
T�tulo da Tabela
| |
Coluna 1 |
Coluna 2 |
| Linha 1 |
C�lula Lin1-Col1 |
C�lula Lin1-Col2 |
| Linha 2 |
C�lula Lin2-Col1 |
C�lula Lin2-Col2 |
| |
Coluna 1 |
Coluna 2 |
| Linha 1 |
C�lula Lin1-Col1 |
C�lula Lin1-Col2 |
| Linha 2 |
C�lula Lin2-Col1 |
C�lula Lin2-Col2 |
T�tulo da Tabela
Atributos: align, valign, width, height,
colspan, rowspan, nowrap e bgcolor.
O atributo align refere-se ao
alinhamento horizontal do texto dentro da c�lula, com
rela��o a suas bordas. Pode ter 3 valores: left (default para
<td>),
center (default para <th>) e right.
| esquerda |
centro |
direita |
| esquerda |
centro |
direita |
O atributo valign refere-se
ao alinhamento vertical do texto dentro da c�lula, com rela��o a suas
bordas. Pode ter 3 valores: top,
middle (default) e bottom.
| top |
middle |
bottom |
top |
middle |
bottom |
O atributo width
O atributo height
O atributo colspan define
quantas colunas de tamanho normal uma c�lula pode
abranger. Exemplo com colspan=2:
O atributo rowspan define
quantas linhas de tamanho normal uma c�lula pode
abranger. Exemplo com rowspan=2:
O atributo nowrap impede
quebras de linha dentro das c�lulas.
| textotextotextotextotextotextotextotextotextotextotextotextotextotextotextotextotextotextotextotextotextotextotextotextotextotextotextotextotextotextotextotexto |
texto |
| texto |
texto |
O atributo bgcolor
| c�d. HEXA |
COR |
c�d. HEXA |
COR |
c�d. HEXA |
COR |
c�d. HEXA |
COR |
c�d. HEXA |
COR |
c�d. HEXA |
COR |
c�d. HEXA |
COR |
| FFFFFF |
|
FF0000 |
|
FFFF00 |
|
00FF00 |
|
00FFFF |
|
0000FF |
|
FF00FF |
|
| F0F0F0 |
|
F00000 |
|
F0F000 |
|
00F000 |
|
00F0F0 |
|
0000F0 |
|
F000F0 |
|
| D0D0D0 |
|
D00000 |
|
D0D000 |
|
00D000 |
|
00D0D0 |
|
0000D0 |
|
D000D0 |
|
| B0B0B0 |
|
B00000 |
|
B0B000 |
|
00B000 |
|
00B0B0 |
|
0000B0 |
|
B000B0 |
|
| 909090 |
|
900000 |
|
909000 |
|
009000 |
|
009090 |
|
000090 |
|
900090 |
|
| 000000 |
|
010000 |
|
020200 |
|
000300 |
|
000404 |
|
000005 |
|
060006 |
|
|