Create table in html
A table is a set of data that is distributed across rows and cells. Most cells host tabular data, and the rest contain headers for rows and columns that describe the content.
To create a table in an HTML document, use the <table>
tag, which is the container that contains the entire contents of the table.
Creating a table always starts with the rows that are defined using the <tr>
tag, and each row in turn consists of cells. The <tr>
tag can contain only tags for creating cells.
In HTML there are two different tags for creating cells, the first of them is <td>
, it creates regular cells with data. By default, the contents of the <td>
tags are aligned to the left. The second tag for creating cells is a <th>
tag, it allows you to define cells that contain headers for columns or rows, the contents of such cells are displayed in bold text and aligned in the center. The <td>
and <th>
tags can include any HTML elements that are available for use in the body of the document.
<table border="1"> <tr><th>First header</th><th>Second header</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>Try it »
Nested tables
In HTML, you can create nested tables, that is, tables that are located inside other tables. To make a nested table, you need to put the code of the table that you want to nest inside any <td>
tag.
For example, take the table we have already created and put this code in the second cell of the second row:
<table border="1"> <tr><th>First header</th><th>Second header</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 <table border="1"> <tr><th>First header</th><th>Second header</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> </td> </tr> </table>Try it »
As a result, we have a table inside the cell of another table, that is, a table inside the table.
With this theme look: