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.

Copying materials from this site is possible only with the permission of the site administration and
when you specify a direct active link to the source.
2011-2018 © puzzleweb.ru

puzinfo@puzzleweb.ru | ruen