table HTML Tag
HTML tables are wrapped by the <table> starting and </table> closing tag. These tags are mandatory elements of HTML tables which also need to contain at least one <tr>, <th>, and <td> elements.
Syntax
<table> <tr> <td>cell</td> </tr> </table>
Every major web browser supports the table tag, but it's recommended to use structured div tags instead, because HTML tables can't be made responsive very easily.
<table> <thead> <tr> <td>Model</td> <td>Price</td> <td>Range</td> </tr> </thead> <tbody> <tr> <td>Model S</td> <td>$83,900</td> <td>651 km</td> </tr> <tr> <td>Model 3</td> <td>$42,900</td> <td>437 km</td> </tr> <tr> <td>Model X</td> <td>$99,990</td> <td>564 km</td> </tr> <tr> <td>Model Y</td> <td>$54,990</td> <td>531 km</td> </tr> </tbody> </table>
Model | Price | Range |
Model S | $83,900 | 651 km |
Model 3 | $42,900 | 437 km |
Model X | $99,990 | 564 km |
Model Y | $54,990 | 531 km |
A simple demo with header and 4 rows
<table border="5" cellpadding="5px" cellspacing="5px" bgcolor="#fff0f0" width="250" height="200" style="vertical-align: middle; text-align: center;"> <tr> <td>Centered text</td> </tr> </table>
Centered text |
It's a common practice to use tables to center text or images vertically
HTML Table Tag Attributes
The HTML <table> tag also supports the following additional attributes which are all considered to be deprecated and it's recommended to use CSS styles instead.
Besides the attributes listed below, table tags support global attributes: accesskey, class, contenteditable, data-*, dir, draggable, hidden, id, lang, spellcheck, style, tabindex, title, translate
- abbr – string: Defines an abbreviated version of the content in the element.
- align – right, left, center, justify, char: Visual alignment of elements contained inside.
- bgcolor – rgb(255,255,255), #FF00FF, colorname: Background color of the table.
- border – numeric value in pixels: Sets the border width. 0 means no border.
- cellpadding – pixels or %: Specifies the space between the cell borders and their contents.
- cellspacing – pixels or %: Specifies the space between cells.
- frame – void, above, below, hsides, lhs, rhs, vsides, box, border: Used in conjunction with the border attribute, specifies which side of the frame that makes up the border surrounding the table is displayed.
- rules – none, groups, rows, cols, all: Used in conjunction with the border attribute, specifies which rules appear between the cells of the table.
- summary – text: The summary of the content.
- width – pixels or %: The width of the table.
HTML Table Generator
Use the online HTML table generator below to create and style a new table according to your needs. Click a cell to get the code for the desired size.