HTML Tables

With HTML you can create tables.

Examples

Tables
This example demonstrates how to create tables in an HTML document.

Table borders
This example demonstrates different table borders.

More Examples

Tables

Tables are defined with the <table> tag. A table is divided into rows (with the <tr> tag), and each row is divided into data cells (with the <td> tag). The letters td stands for "table data," which is the content of a data cell. A data cell can contain text, images, lists, paragraphs, forms, horizontal rules, tables, etc.

<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>

How it looks in a browser:

Tables and the Border Attribute

If you do not specify a border attribute the table will be displayed without any borders. Sometimes this can be useful, but most of the time, you want the borders to show.

To display a table with borders, you will have to use the border attribute:

<table border="1">
<tr>
<td>Row 1, cell 1</td>
<td>Row 1, cell 2</td>
</tr>
</table>

Headings in a Table

Headings in a table are defined with the <th> tag.

<table border="1">
<tr>
<th>Heading</th>
<th>Another Heading</th>
</tr>
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>

How it looks in a browser:

Empty Cells in a Table

Table cells with no content are not displayed very well in most browsers.

<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td></td>
</tr>
</table>

How it looks in a browser:

Note that the borders around the empty table cell are missing.

To avoid this, add a non-breaking space (&nbsp;) to empty data cells, to make the borders visible: 

<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>&nbsp;</td>
</tr>
</table>

How it looks in a browser:

Basic Notes - Useful Tips

The <thead>,<tbody> and <tfoot> elements are seldom used, because of bad browser support. Expect this to change in future versions of XHTML. If you have Internet Explorer 5.0 or newer, you can view a working example in our XML tutorial.

More Examples

Table with no border
This example demonstrates a table with no borders.

Headings in a table
This example demonstrates how to display table headers.

Empty cells
This example demonstrates how to use "&nbsp;" to handle cells that have no content.

Table with a caption
This example demonstrates a table with a caption.

Table cells that span more than one row/column
This example demonstrates how to define table cells that span more than one row or one column.

Tags inside a table
This example demonstrates how to display elements inside other elements.

Cell padding
This example demonstrates how to use cellpadding to create more white space between the cell content and its borders.

Cell spacing
This example demonstrates how to use cellspacing to increase the distance between the cells.

Add a background color or a background image to a table
This example demonstrates how to add a background to a table.

Add a background color or a background image to a table cell
This example demonstrates how to add a background to one or more table cells.

Align the content in a table cell
This example demonstrates how to use the "align" attribute to align the content of cells, to create a "nice-looking" table.

The frame attribute
This example demonstrates how to use the "frame" attribute to control the borders around the table.

Table Tags:

NN: Netscape, IE: Internet Explorer, W3C: Web Standard

Jump to: Top of Page or HOME or Printer friendly page

Search W3Schools:

What Others Say About Us

Does the world know about us? Check out these places:

Dogpile Alta Vista MSN Google Excite Lycos Yahoo Ask Jeeves

We Help You For Free. You Can Help Us!

• Tell your newsgroup or mailing list
• Link to us from your pages
• Help us correct errors and broken links
• Help us with spelling and grammar
• Validate the XHTML code of this page

W3Schools is for training only. We do not warrant its correctness or its fitness for use. The risk of using it remains entirely with the user. While using this site, you agree to have read and accepted our terms of use and privacy policy.

Copyright 1999-2002 by Refsnes Data. All Rights Reserved

How we converted to XHTML