</thead>, <tbody>, e <tfoot> - Tags para definir uma tabela -1


São as tags que definem cada parte de uma tabela.

As tags <thead> </thead> é utilizada para agrupar o conteúdo em uma tabela HTML.

E essas tags trabalham em conjunto com as outras tags <tfoot>, </tfoot>, e <tbody>, </tbody>, que também servem para agrupar os elementos.

Vamos ver cada uma com seus atributos.

A tag <thead> é a tag que define o cabeçalho da tabela.

A tag <thead> deve ficar dentro da tag<table>, após <caption> e <colgroup>, e antes de qualquer tag<tbody>, <tfoot> e <tr>.

A tag <thead> deve ter uma ou mais tag<tr> dentro dela.

Atributos da tag <thead>:

Aqui temos o Atributo: e aqui, o valor.

Align:  right, left, center, justify, char

(Alinhar: direito, esquerda, centro, justificar, caractere.)

Charoff: number

Valign: top, middle, bottom, baseline

A tag <tbody> é a tag que define o corpo da tabela.

A tag <tbody> deve ter uma ou mais tags <tr> dentro.

A tag<tbody> deve ficar dentro da tag <table>, após qualquer tag <caption>, <colgroup> e <thead>.

Os atributos dessa tag são os mesmos da tag <thead>.

A tag <tfoot> é utilizada para definir o rodapé de uma tabela e deve ter dentro dela uma ou mais tags <tr>.

A tag <tfoot> é usada em conjunto com as

tags <thead> e <tbody> , para especificar cada parte de uma tabela

(rodapé, cabeçalho, corpo).

A tag<tfoot> deve ficar dentro da tag <table>, após tags como<caption>, <colgroup> e <thead e antes de qualquer tag<tbody> e <tr>.

Os atributos dessa tag são os mesmos das outras duas tags anteriores.

Essas três tags <thead>, <tbody> e <tfoot> usadas na tabela não muda o layout dela.

Mas, para mudar o layout da tabela, você pode usar CSS.

Isso verá na próxima postagem. Ok.

Estarei postando e ensinando como fazer isso.

Agora vamos ver isso tudo numa estrutura de um documento html:

Digite esse código html no bloco de notas e salve, e depois abra ele com o navegador para visualizar.

 <html>

  <head>

     <title>Definindo a Tabela HTML</title>

  </head>

  <body>

    <h1>Nesta página vemos a utilização

de thead, tbody e tfoot</h1>

    <table border="1">

      <thead>

        <tr>

          <th>Vendas</th>

          <th>Valor</th>

        </tr>

      </thead>

      <tfoot> <! - Nota que a tag tfoot tem que ser colocada antes do tbody - >

        <tr>

          <td>Soma</td>

          <td>R$ 230,00</td>

        </tr>

      </tfoot>

      <tbody>

        <tr>

          <td>Janeiro</td>

          <td>R$ 90,00</td>

        </tr>

        <tr>

          <td>Fevereiro</td>

          <td>R$ 140,00</td>

        </tr>

      </tbody>

    </table>

</body>

</html>


No navegador ficará assim:













Finalizo por aqui, e na próxima postagem vamos ver mais um pouco de definição de tabela com as tags thead, tfoot, e tbody. 
 

Nenhum comentário:

Postar um comentário

Marcadores

etiqueta (29) tutorial (18) meta (16) html (15) a (10) link (10) formatar texto (3) VETOR (2) body (2) caracteres (2) id (2) p (2) vídeo (2) âncora (2) Photoshop (1) address (1) blink (1) blockquote (1) br (1) center (1) div (1) e-mail (1) font (1) frameset (1) h (1) head (1) pre (1) title (1)

paginador numerico