Resumo de Html Básico

TABELAS HTML

Tabelas são definidas pela tag <table>.

Uma tabela está dividida em linhas pela tag <tr>, e cada linha está dividida em células pela tag <td>, do inglês table data <td>e table row <tr>. A tag <td> pode conter textos, links, imagens, listas, formulários, outras tabelas e etc.

EXEMPLO:

<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>

Abra o notepad (bloco de notas) do windows (iniciar -> acessórios -> notepad), escreva o código do exemplo acima, salve como tabela.html. Clique duas vezes sobre o arquivo criado, o browser deve abrir uma página web e exibir como ficou a tabela.

_______________________________________________________________________________
O ATRIBUTO BORDER

Se não for especificado o atributo border, a tabela será exibida sem nenhuma borda. Para definir as bordas da tabela, utiliza-se o atributo border na tag <table> :

<table border="1">
<tr>
<td>Row 1, cell 1</td>
<td>Row 1, cell 2</td>
</tr>
</table>

_______________________________________________________________________________
HEADERS (TÍTULOS DE COLUNAS)

Os títulos das colunas dastabelas são definidos pela tag <th>.

O texto de um header será exibido em negrito e no centro da célula.

<table border="1">
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>

Copie o código acima no bloco de notas, salve como headers.html e execute o arquivo para ver o exemplo.

_______________________________________________________________________________
TENTE VOCÊ MESMO:

Tabelas: http://www.w3schools.com/html/html_tables.asp
(Como criar tabelas em um documnto HTML).

Bordas: http://www.w3schools.com/html/tryit.asp?filename=tryhtml_table_borders
(Como especificar diferentes bordas)

Tabelas sem bordas: http://www.w3schools.com/html/tryit.asp?filename=tryhtml_tables3

Títulos das Colunas: http://www.w3schools.com/html/tryit.asp?filename=tryhtml_table_headers

Títulos das Tabelas: http://www.w3schools.com/html/tryit.asp?filename=tryhtml_tables2

Rowspan e colspan: subdividindo células:
http://www.w3schools.com/html/tryit.asp?filename=tryhtml_table_span

Tags dentro de tabelas: http://www.w3schools.com/html/tryit.asp?filename=tryhtml_table_elements

Cellpadding (margens): http://www.w3schools.com/html/tryit.asp?filename=tryhtml_table_elements

Cellspacing (espaço entre as células):
http://www.w3schools.com/html/tryit.asp?filename=tryhtml_table_cellspacing

O atributo frame: http://www.w3schools.com/html/tryit.asp?filename=tryhtml_table_frame

Resumos Relacionados