113 - TABLE
Attributes of the Tag <TABLE>: ALIGN and BGCOLOR

       


<HTML>
<HEAD>
<TITLE>
113 - TABLE
</TITLE>
</HEAD>

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

<CENTER>
<!----------------------------------------Remarks
Note the tag <CENTER> below the tag <BODY> and
the tag </CENTER> above the tag </BODY> making
all the contents of the home page to be centered
on the screen.
------------------------------------------------------------->

<P> <B> TAG TABLE ATTRIBUTES </B>

<P> ALIGN (Horizontal alignment of the table on the screen)
<BR>BGCOLOR (BackGround Color)

<TABLE BORDER=1 ALIGN=Left BGCOLOR=Yellow>
<!--------------------------------------Table Background Colors
Possible colors by means of words:
White, Aqua, Fuchsia, Blue, Yellow, Lime, Red, Silver
Gray, Teal, Purple, Navy, Olive, Green, Maroon, Black
-------------------------------------------------------------->

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

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

</TABLE>
<!--------------------------------------Yellow Table at Left
Specifying ALIGN=Left the table is aligned at left in spite
of the tag <CENTER> before it.
Values for the attribute ALIGN are: Left, Right and Center.
Specifying BGCOLOR=Yellow the whole table background color
is, of course, yellow.
----------------------------------------------------------->

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

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

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

</TABLE>
<!--------------------------------------Blue Table at Right
Specifying ALIGN=Right the table is aligned at right in spite
of the tag <CENTER> before it.
Specifying BGCOLOR=Aqua the whole table background color
is, of course, light blue.
------------------------------------------------------------>

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

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

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

</TABLE>
<!--------------------------------------Red Table in the Center
Specifying ALIGN=Center the table is aligned in the center only
confirming the tag <CENTER> before it.

ATTENTION: To obtain the home page whose image is below, the
tables must have the following vertical disposition: Table ALIGN=Left,
Table ALIGN=Right and last Table ALIGN=Center, as above.

The normal use of Table ALIGN=Left and Table ALIGN=Right is in order
to display the tables side by side. Table ALIGN=Center is normally
used for isolated tables on the screen.

The centralization of a table on the screen may also be obtained
without its attribute ALIGN, but using the tags <CENTER>
and </CENTER>, respectively before and after it.
Specifying BGCOLOR=Red the whole table background color
is, of course, red.
------------------------------------------------------------->

</CENTER>

</BODY>

</HTML>

 

How to test the home page above:

[1] Copy the codes from <HTML> to </HTML> into a new file using the Windows Notepad or a HTML editor.

[2] Save the file with whichever name but with the extension .htm or .html in a computer folder (suggested name for the folder: BasicHTML) specially created for holding this course test files.

Suggestion for the name of the file: AATestXXX.htm where XXX is the number at the top of this screen. The double "A" will put the file name at the top of the list in the folder, making it easier to locate.

[3] Open the file by means of any browser to get the following home page, supposing it has been made the download of the file BGWite.jpg as required in the Lesson 104:

Note the following remarks:

  1. The specified color of the attribute BGCOLOR of the tag <TABLE> affects the whole table except where other attributes BGCOLOR of the tags <TR> and <TD> (or tag <TH>) specify other colors.

  2. One cell tables are oftenly used with the attribute BORDER=0 and an adequate background color to display frames in the home page.
    Example:

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

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

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

       <TR>
         <TD>


         <CENTER><B>NO BORDER TABLE</B></CENTER>
         <P ALIGN=justify>
         A server is a computer that receives
         and sends files among computers
         linked to a network.
         <BR>Internet providers
         have servers that accomplish
         this function in the Internet.


         </TD>
      </TR>

    </TABLE>

    </CENTER>

    </BODY>

    </HTML>

  3. Another application often used for one cell table is to display a thick (or thin) frame around images, mainly photos.
    Example:
    OBS: To test this example it is necessary to download the file Flor05.jpg (1,5 Kb) to the same computer folder where this example home page is to be saved, clicking HERE.

    <HTML>
    <HEAD>
    <TITLE>
    113 - TABLE
    </TITLE>
    </HEAD>

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

    <TABLE BORDER=6>

       <TR>
         <TD>


         <IMG SRC="Flor05.jpg">


         </TD>
      </TR>

    </TABLE>

    </CENTER>

    </BODY>

    </HTML>

  4. The values of the attribute BGCOLOR may also be specified in hexadecimal codes found in HTML books or directly edited through a HTML editor.

 

Updated Aug/2000 by