HTML Tables

• The <table> HTML element represents tabular data — that is, information presented in a two-dimensional table comprised of rows and columns of cells containing data.

Syntax of HTML Table

<table>
  // table content
</table>

Key Elements of HTML Table

• <table>: Defines the table itself.
• <tr>: Used for table rows.
• <th>: Used for table headings.
• <td>: Used for table cells (data).

Basic Table Structure

<table>
  <tr>
    <th>Name</th>
    <th>Age</th>
  </tr>
  <tr>
    <td>Harry</td>
    <td>100</td>
  </tr>
</table>

Rowspan Attribute

•  If you want a table cell to span multiple rows, you can use the rowspan attribute.

<td rowspan="value">

Colspan Attribute

•  If you want a table cell to span multiple columns, you can use the colspan attribute.

<td colspan="value">

Visual Representation of Rowspan and Colspan

<table>

        <thead>

            <tr>

                <th colspan="7">timetable</th>

            </tr>

        </thead>

        <tbody>

            <tr>

                <td rowspan="6">hours</td>

                <td>Mon</td>

                <td>Tue</td>

                <td>Wed</td>

                <td>thr</td>

                <td>Fri</td>

                <td>Sat</td>

            </tr>

            <tr>

                <td>math</td>

                <td>math</td>

                <td>math</td>

                <td>math</td>

                <td>math</td>

                <td>math</td>

            </tr>

            <tr>

                <td>math</td>

                <td>math</td>

                <td>math</td>

                <td>math</td>

                <td>math</td>

                <td>math</td>

            </tr>

            <tr>

                <td colspan="6">Lunch</td>

            </tr>

            <tr>

                <td>math</td>

                <td>math</td>

                <td>math</td>

                <td>math</td>

                <td>math</td>

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

            </tr>

            <tr>

                <td>math</td>

                <td>math</td>

                <td>math</td>

                <td>math</td>

                <td>math</td>

            </tr>

        </tbody>

    </table>