How to Create a Website

Website Design Basics

Website Table Layout

What Is A Website Table?

When you view the source code of websites, you will see that a lot of these sites have tables. A table is basically a grid that have cells, that are arranged in rows and columns. Each cell can have text, headings or cell spacing.

Example of a table:

Product Code	Product Name	Product Price
203A	Motherboard	$80
51Z	CPU	$120
8000Q	Monitor	$105

The Code:

<table border="1" cellpadding="0" cellspacing="0"   style="border-collapse: collapse" width="100%" bgcolor="#FFFFFF" bordercolor="#008080" id="table3">
   <tr>
         <td width="116" bgcolor="#FFCC99">
         <p align="center"> <b>Product Code</b></td>
         <td width="242" bgcolor="#FFCC99">
         <p align="center"><b>Product Name</b></td>
         <td bgcolor="#FFCC99">
         <p align="center"><b>Product Price</b></td>
</tr>

   <tr>
         <td width="116">
         <p align="center"> 203A</td>
         <td width="242">Motherboard</td>
         <td>$80</td>
   </tr>

    <tr>
         <td width="116">
         <p align="center">8000Q</td>
         <td width="242">Monitor</td>
         <td>$105</td>
    </tr>
</table>

Table HTML Basic Syntax

<table ...>
<tr ...> Table row
<td ...> Table data
<th ...> Table header
<col ...> Column
<colgroup...> Column group
<caption ...>
<thead ...> Table header section
<tbody ...> Table body section
<tfoot ...> Table footer section
border
width
bgcolor

Make Website Layout With A Table

You have seen the example of a table above. So it is possible to make a website layout with tables.

Nowadays you can use CSS - cascading stylesheets to create a website layout. I will discuss CSS indepth in other articles on this website.