# HTML Tables

HTML tables are used to display data in rows and columns. They are useful for showing information like student details, employee records, product lists, marks, and timetables. Tables should be used only for displaying related data, not for designing the layout of a webpage.

The <table> tag creates the table. The <tr> tag creates a row, <th> creates a header cell, and <td> creates a normal data cell. Header cells can be placed at the top of the table or on the left side, depending on how the data is organized. If the headers are only on the left side, using the <thead> tag is not required because <thead> is mainly used to group header rows.

Other useful tags are <caption>, which adds a title to the table, <tbody>, which contains the main table data, and <tfoot>, which contains the footer rows. The colspan attribute is used to merge columns, and the rowspan attribute is used to merge rows. Older HTML used attributes like border, cellpadding, and cellspacing, but modern websites use CSS for styling tables because it keeps the HTML clean and easy to maintain.

Basic Example

<table border="1">
    <caption>Student Details</caption>

    <thead>
        <tr>
            <th>Name</th>
            <th>Age</th>
            <th>Department</th>
        </tr>
    </thead>

    <tbody>
        <tr>
            <td>Abimanyu</td>
            <td>21</td>
            <td>CSE</td>
        </tr>
        <tr>
            <td>Abishek</td>
            <td>22</td>
            <td>IT</td>
        </tr>
    </tbody>
</table>

Example:First column as a head:

<table border="1">
    <caption>Student Information</caption>

    <tr>
        <th scope="row">Name</th>
        <td>Abimanyu</td>
    </tr>

    <tr>
        <th scope="row">Age</th>
        <td>21</td>
    </tr>

    <tr>
        <th scope="row">Department</th>
        <td>CSE</td>
    </tr>

    <tr>
        <th scope="row">College</th>
        <td>Anna University</td>
    </tr>
</table>