Menu
HTML

HTML Tables

7. Tables:

  • <table>: Represents an HTML table.
  • <thead>: Contains the header row(s) in the table.
  • <tbody>: Contains the body content (main data) of the table.
  • <tfoot>: Contains the footer row(s) in the table.
  • <tr>: Represents a table row.
  • <th>: Represents a header cell within a table row (<thead> or <tfoot>).
  • <td>: Represents a standard data cell within a table row (<tbody>).
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Table Example</title>
</head>
<body>

<!-- Example of using the <table> element -->
<table border="1">
    <!-- Table Header using <thead> -->
    <thead>
        <tr>
            <th>Header 1</th>
            <th>Header 2</th>
            <th>Header 3</th>
        </tr>
    </thead>

    <!-- Table Body using <tbody> -->
    <tbody>
        <!-- Table Row using <tr> -->
        <tr>
            <!-- Table Data Cells using <td> -->
            <td>Data 1,1</td>
            <td>Data 1,2</td>
            <td>Data 1,3</td>
        </tr>
        <tr>
            <td>Data 2,1</td>
            <td>Data 2,2</td>
            <td>Data 2,3</td>
        </tr>
        <tr>
            <td>Data 3,1</td>
            <td>Data 3,2</td>
            <td>Data 3,3</td>
        </tr>
    </tbody>

    <!-- Table Footer using <tfoot> -->
    <tfoot>
        <tr>
            <td>Footer 1</td>
            <td>Footer 2</td>
            <td>Footer 3</td>
        </tr>
    </tfoot>
</table>

</body>
</html>
HTML