HTML td Tag Tutorial

In this section, we will learn what HTML <td> element is and how to use it.

What is <td> Tag in HTML?

HTML <td> element stands for Table Data and is used when we want to create a cell in a table and add data to that cell.

Basically, the value we set in the body of this element is the content of the created cell.

Notes:

  • HTML <td> element is used in the body of HTML <tr> element, which stands for Table Row. This means each table has one or more table rows which are created via the <tr> element and in those rows we set <td> elements to create cells for the table.
  • We say Table Data cell because there is another type of cell in a table which is called Table Header Cell. You can learn about this in the HTML <th> element section.

HTML <td> Tag Syntax:

<td> value </td>

HTML <td> Tag Values

The value we set for the <td> element will be the content of the created table data cell.

Example: using <td> tag in HTML

See the Pen using <td> tag in HTML by Omid Dehghan (@odehghan) on CodePen.

HTML <td> Background Color:

Using CSS, we can style one or more table data cells as well. For example, we can use CSS background-color property to change the background of these cells.

Example: changing the background of HTML <td>

See the Pen changing the background of HTML <td> by Omid Dehghan (@odehghan) on CodePen.

HTML <td> Tag Attributes

Name

Description

colspan

Using this attribute, we can set the width of the target table data cell in terms of the number of columns of the owner table.

headers

This attribute specifies one or more header cells that this table data cell is related to.

rowspan

Using this attribute, we can set the height of the target table data cell in terms of the number of rows of the owner table.

FAQ:

What does td stand for?

HTML td element stands for Table Date and it is used to create a table cell where we can put data in that cell.

Leave a Reply