HTML Tables

HTML tables are used to display data in rows and columns. They help organize information in a structured format.

What is an HTML Table?

An HTML table is created using the <table> tag. Rows are defined using <tr>, header cells using <th>, and data cells using <td>.

Basic Table Example

<table border="1">
  <tr>
    <th>S.No</th>
    <th>Name</th>
    <th>Roll No</th>
  </tr>

  <tr>
    <td>1</td>
    <td>Ritesh</td>
    <td>234</td>
  </tr>

  <tr>
    <td>2</td>
    <td>Firoz</td>
    <td>456</td>
  </tr>
</table>

Table Tags

<table>

Defines the complete table.

<tr>

Defines a table row.

<th>

Defines a table header cell.

<td>

Defines a table data cell.

Table Caption

The <caption> tag provides a title for the table.

<table>
  <caption>Student List</caption>
</table>

Colspan

The colspan attribute allows a cell to span multiple columns.

<td colspan="2">Combined Cell</td>

Rowspan

The rowspan attribute allows a cell to span multiple rows.

<td rowspan="2">Data</td>

Table Sections

• <thead> – Header section
• <tbody> – Main table data
• <tfoot> – Footer section

Advantages of HTML Tables

• Organizes information clearly
• Easy comparison of data
• Improves readability
• Useful for reports and records
• Can be styled using CSS

Key Points

• <table> creates a table.
• <tr> creates rows.
• <th> creates header cells.
• <td> creates data cells.
• colspan merges columns.
• rowspan merges rows.
• <caption> adds a title.
• <thead>, <tbody> and <tfoot> divide table sections.