How to Build a HTML Table

by Brandy Alexander, Demand Media

A HTML table is a significant method for displaying and arranging tabular data on a web page or for constructing an email in HTML. Tables may contain various types of information including lists, links and images. You can adjust the size of your tables as well as specify certain details, such as how many columns, rows and headings you have use for. Tables easily work into a web page and only require a few key tags to build one.

Items you will need

HTML text editor, such as BBEdit or Dreamweaver

Step 1

Open a document in an HTML text editor, such as BBEdit or Dreamweaver. Enter the opening

tag. This is the initial element that begins your table.

Step 2

Specify the width, border, cellspacing and cellpadding within the opening

tag. The width dictates how wide your table is; the border indicates the thickness of the table's outline; the cellspacing specifies the area around the table's cells; and the cellpadding outlines the space around the table's text. For example:

Step 3

Enter a summary within the

tag. The summary is a description of what your table contains and is necessary to provide information to those viewers who use a screen reader. For example:

Step 4

Enter the caption of your table and specify its alignment, such as top or bottom, according to your preference. For example:

Step 5

Enter the opening

tag to add your first table row.

Step 6

Enter the opening

tag. This tag gives the table a column and makes the text bold to indicate it is a column title.

Step 7

Enter the amount of columns and column headings you require. For example, a table with 3 columns is entered as:

Step 8

Enter an opening

and and tags. A table with 3 columns will have 3 opening and closing

Step 9

Enter the closing

Sample HTML Table
tag, add the text of your column heading, and enter the closing	Column 1	Column 2
tag, add the table's data and enter the closing
tags so that each table data corresponds to a space under a column heading. For example:
Row 1, Column 1	Row 2, Column 2	Row 3, Column 3

tag to complete your table.

Tips

You can add a background or border color to your table by entering it within the opening tag. For example:

References

HTML Tables

Resources

Tables in HTML Documents

About the Author

Brandy Alexander has been writing professionally since 2001. She is a glass artist with a Web design and technical writing background. Alexander runs her own art-glass business and has been a contributor to "Glass Line Magazine" as well as various online publications.