Tables

Concepts

The grid is a design pattern in art, architecture, and page layout design. Many see it as the signature motif of 20th century design.

The TABLE element of HTML is an important invention because it gives people a way to present data in a tabular format. The TABLE element also is a very popular way to set the layout of a page and align visual features according to a grid.

How Tables Work

To make an HTML table, you have to remember the four basic elements: the TABLE element itself, which is the container for table rows (TR). The table rows contain table header cells (TH) or table data cells (TD).

The key is to remember that head or data cells are contained within rows and the rows are contained within the table.

Parts of a Table

Here is a basic "Table" document.

You'll notice that this table demonstrates the four basic table elements:

• TABLE
• TR
• TH
• TD

Exercise: Make a simple table

In addition to the basic Table demo, take a look at this "dressed up" Table demo.

Make your own simple table to show your class schedule, favorite team's scores, or some other information that is represented in table form.