013 - TABELAS
Atributos do Tag <TABLE>: ALIGN e BGCOLOR

       


<HTML>
<HEAD>
<TITLE>
013 - TABELAS
</TITLE>
</HEAD>

<P> <BODY BACKGROUND="BGWite.jpg">

<CENTER>
<!----------------------------------------Conteudo Centrado da HP
Repare o tag <CENTER> abaixo de <BODY> e
o </CENTER> acima de </BODY> fazendo
todo o conteudo da home page ficar centrado.
------------------------------------------------------------->

<P> <B> ATRIBUTOS DO TAG TABLE </B>

<P> ALIGN (Alinhamento horizontal na tela)
<BR>BGCOLOR (BackGround Color)
<BR>Cor de Fundo da Tabela

<TABLE BORDER=1 ALIGN=Left BGCOLOR=Yellow>
<!-----------------------------------------------Cores de Fundos
Cores poss�veis por meio do nome de cores em ingl�s:
White, Aqua, Fuchsia, Blue, Yellow, Lime, Red, Silver
Gray, Teal, Purple, Navy, Olive, Green, Maroon, Black
-------------------------------------------------------------->

   <TR>
     <TD>
     Lin 1 Col 1
     </TD>
     <TD>
     Lin 1 Col 2
     </TD>
  </TR>

   <TR>
     <TD>
     Lin 2 Col 1
     </TD>
     <TD>
     Lin 2 Col 2
     </TD>
  </TR>

</TABLE>
<!--------------------------------------Tabela Amarela � Esquerda
Com ALIGN=Left a tabela se posiciona a esquerda apesar de haver
o tag <CENTER> antes dela. Os valores para ALIGN s�o:
Left (Esquerda), Center (Centro) e Right (Direita) da tela.
Com BGCOLOR=Yellow a cor do fundo da tabela � exibida amarela.
----------------------------------------------------------->

<TABLE BORDER=1 ALIGN=Right BGCOLOR=Aqua>

   <TR>
     <TD>
     Lin 1 Col 1
     </TD>
     <TD>
     Lin 1 Col 2
     </TD>
  </TR>

   <TR>
     <TD>
     Lin 2 Col 1
     </TD>
     <TD>
     Lin 2 Col 2
     </TD>
  </TR>

</TABLE>
<!--------------------------------------Tabela Azul � Direita
Com ALIGN=Right a tabela se posiciona a direita apesar de haver
o tag <CENTER> antes dela.
Com BGCOLOR=Aqua a cor do fundo da tabela � exibida �gua marinha.
------------------------------------------------------------>

<TABLE BORDER=1 ALIGN=Center BGCOLOR=Red>

   <TR>
     <TD>
     Lin 1 Col 1
     </TD>
     <TD>
     Lin 1 Col 2
     </TD>
  </TR>

   <TR>
     <TD>
     Lin 2 Col 1
     </TD>
     <TD>
     Lin 2 Col 2
     </TD>
  </TR>

</TABLE>
<!--------------------------------------Tabela Vermelha ao Centro
Com ALIGN=Center a tabela se posiciona ao centro apenas confirmando
o tag <CENTER> antes dela.
ATEN��O: Para se obter o efeito da imagem abaixo, as tabelas
devem ter a seguinte disposi��o vertical: Tabela ALIGN=Left,
Tabela ALIGN=Right e por �ltimo Tabela ALIGN=Center, como acima.

O uso normal � ALIGN=Left e ALIGN=Right, para se por uma
tabela ao lado da outra. O ALIGN=Center se usa normalmente em
tabelas isoladas. A centraliza��o da tabela na tela tamb�m pode
ser obtida sem ALIGN, mas com os tags <CENTER> e </CENTER>.
Com BGCOLOR=Red a cor do fundo da tabela � exibida vermelha.
------------------------------------------------------------->

</CENTER>

</BODY>

</HTML>

 

Como testar a homepage acima:

[1] Copiar o texto de <HTML> at� </HTML>, para um arquivo novo, no Bloco de Notas do Windows ou em um editor pr�prio de HTML.

[2] Salvar o arquivo com qualquer nome mas, com extens�o .htm ou .html na mesma pasta do computador em que se encontram os arquivos deste curso.
Sugest�o para o nome do arquivo: AAULAxxx.htm onde xxx � o n�mero acima desta tela. O "A" dobrado � para o arquivo ficar acima dos outros, facilitando sua visualiza��o ao ter que abr�-lo.

[3] Abrir o arquivo por meio de um browser (navegador) para obter a seguinte home page, pressupondo-se que tenha sido feito o download do arquivo BGWite.jpg exigido na Aula 004:

Observe o seguinte:

  1. A cor que se declara com o atributo BGCOLOR do tag <TABLE> afeta toda a tabela exceto onde outros atributos BGCOLOR dos tags <TR> e <TD> (ou tag <TH>) explicitarem outra cor, como veremos adiante.

  2. Tabela com uma s� c�lula s�o muito usadas utilizando-se BORDER=O e uma cor de fundo adequada, para se abrir pequenas (ou grandes) janelas na home page. Exemplo:

    <HTML>
    <HEAD>
    <TITLE>
    013 - TABELAS
    </TITLE>
    </HEAD>

    <P> <BODY BACKGROUND="BGWite.jpg">

    <TABLE BORDER=0 WIDTH=250 BGCOLOR=Aqua>

       <TR>
         <TD>


         <CENTER><B>TABELA SEM BORDAS</B></CENTER>
         <P ALIGN=justify>
         Servidor � um computador que recebe
         e envia arquivos entre computadores
         em uma rede de computadores.
         <BR>Os provedores de conex�es Internet
         possuem servidores que realizam
         esta fun��o na Internet.


         </TD>
      </TR>

    </TABLE>

    </CENTER>

    </BODY>

    </HTML>

  3. Outra aplica��o muito usada para as tabelas, com apenas uma c�lula, � a de se exibir molduras em torno imagens, principalmente, fotos. Exemplo:
    OBS: Para se testar o exemplo abaixo � necess�rio proceder a um download do arquivo Flor05.jpg (1,5 Kb) para a mesma pasta do computador em que se salvar a homepage de teste, clicando AQUI.

    <HTML>
    <HEAD>
    <TITLE>
    013 - TABELAS
    </TITLE>
    </HEAD>

    <P> <BODY BACKGROUND="BGWite.jpg">

    <TABLE BORDER=6>

       <TR>
         <TD>


         <IMG SRC="Flor05.jpg">


         </TD>
      </TR>

    </TABLE>

    </CENTER>

    </BODY>

    </HTML>

  4. Os atributos de cor do atributo BGCOLOR podem ser tamb�m expl�citos em c�digos hexadecimais, consultando-se tabelas existentes em livros sobre HTML ou aplicando-se diretamente nos tags com editores pr�prios para c�digo HTML.

 

Atualiza��o em Agosto/2000 por

Hosted by www.Geocities.ws

1