HTML Table

HTML Table

<table> tag is used to design a table.

<tr>, <th>, <td> are the tags used and written inside the <table> tag.

  • <tr> - Table Row
  • <th> - Table Heading
  • <td> - Table Data

<tr> tag in HTML (table row)

To start the row <tr> tag is used.

<th> tag in HTML (table heading)

<th> tag is defined inside the <tr> tag and its default text style is bold and centered.

<td> tag in HTML (table data)

Contents to be displayed, are written inside the <td> tag, and it is defined inside <tr> tag.



Try Yourself

width, height and border Attribute in HTML table tag

The width attribute is used to set the width of the whole table.

The height attribute is used to set the height of the table.

If the values are given in percentage(%), table size will automatically adjust itself according to the screen size.

Example - Table width

Try Yourself

Example - Table height

Try Yourself

The border attribute is used to draw the border line for table.

Example - Table border

Try Yourself

cellspacing and cellpadding attribute in HTML table

The cellspacing attribute is used to give space between two cell (<td> tag).

The cellpadding attribute is used to adjust the space in the cell and the contents present in it, by doing so the size of the cell can be changed.

Example - Table cellspacing & cellpadding

Try Yourself

colspan in HTML table

The colspan attribute is used to merge two columns into one cell.

Example - Table colspan

Try Yourself

rowspan in HTML table

The rowspan attribute is used to merge two rows into one cell.

Example - Table rowspan

Try Yourself

<caption> tag in HTML

The HTML <caption> tag is used for creating a caption or a title for a table.

There should be only one caption per table.

Example - Table title

Try Yourself