HTML Tables

This page demonstrates how to create HTML tables. You can copy and paste the code into your own webpage or HTML document.

HTML tables are created using the HTML <table> tag. You combine this tag with other tags that define each row and column within your table.

Basic HTML Table

Here's an example of a basic HTML table:

Source CodeResult
Table HeaderTable Header
Table cell 1Table cell 2
Table cell 3Table cell 4

Adding Styles

You can use Cascading Style Sheets (CSS) to style your table so that it changes the look.

Source CodeResult
Table HeaderTable Header
Table cell 1Table cell 2
Table cell 3Table cell 4

The code above uses the <table> tags to create the outer table. Then it uses the <tr> tags to define each table row. The <th> tags define the table header cells, and the <td> tags define each table data cell.

Note that the table header cells display the text slightly differently to the table data cells. This is because, the table headers are supposed to stand out.

This example uses Cascading Style Sheets (CSS) to determine how the table looks. This is everything between the opening and closing <style> tags. You can actually remove this code and the table will be a normal looking HTML table. Nothing wrong with that. Of course, you can also modify the CSS code to give your HTML tables a unique look and feel.

Same Table, Different Style

Below is an example of the same HTML table, but with a different set of styles. In other words, the HTML table has been coded using the exactly the same HTML code as the one in the above example. The only difference is that it references a different stylesheet (i.e. it uses class="myOtherTable" instead of class="myTable").

This demonstrates how changing the CSS part of the code can have a huge impact on how the HTML table is displayed in the browser.

Source CodeResult
Table HeaderTable Header
Table cell 1Table cell 2
Table cell 3Table cell 4

About HTML.am

HTML.am was created in order to provide HTML tools, codes, tutorials, and other resources to help webmasters create and maintain their HTML documents.

HTML.am aims primarily at beginners, but may also be useful to web professionals.

About the HTML Codes

The HTML codes on this website are provided free of charge, for you to use however you wish. Feel free to modify the code to suit your own needs.

My Related Sites

Here are some of my other sites: