Create Tables: Part I

The table element <TABLE> </TABLE> has been using as one of the important design elements in Web environment. You may think of table is a collection of rows and columns. The intersection of a row and a column is called a cell, where your data, text, and images are placed in. Knowing how to use it will further enhance your abilities of controlling the design and the layout of the Web pages. In this article, we'll show you how to create tables and use it as a design tool.

1. Definition of Basic Tags Used in Table Element

<TABLE> </TABLE> : This container or pair of tags begins and ends of a table.
<TR> </TR> tag pair defines a row or a "table row."
<TH></TH> tag pair specifies the heading or "table heading"
<TD> </TD> tag pair defines a cell or "table data."

A frame work for a simple table-based HTML document (one row and one cell) would look like this one:
<HTML>
<HEAD>
<TITLE>An Example of Creating A Simple Table</TITLE>
</HEAD>
<BODY>
<TABLE>
     <TR>
         <TD> </TD>
    </TR>
</TABLE>
</BODY>
</HTML>

2.Creating Tables By Examples

Example1: Create a basic two-row, three-column table (six cells).
<TABLE BORDER="1" WIDTH="100%">
<TR>
    <TD WIDTH="33%">Name</TD>
    <TD WIDTH="33%">Address</TD>
   <TD WIDTH="34%">Phone</TD>
</TR>
<TR>
    <TD WIDTH="33%">Anne Williams</TD>
    <TD WIDTH="33%">Internet Ave</TD>
   <TD WIDTH="34%">456-7890</TD>
</TR>
</TABLE>
</BODY>
<HTML>

The above HTML code will be displayed in your browser similar to this one:

Name Address Phone

Anne Williams Internet Ave 456-7890