HTML Table Cells

HTML tables are a great way to display tabular data on a web page. A table is made up of rows and columns, and at the intersection of each row and column is a table cell. Here's a quick guide to understanding table cells in HTML.

Types of Table Cells

Data Cells (<td>):

Used to define standard table cells that hold data. html Copy code

<table>
    <tr>
        <td>Apple</td>
        <td>50</td>
    </tr>
</table>

Header Cells (<th>):

Used to define header cells, typically at the top of a column or the start of a row. By default, text inside <th> is bold and centered. html Copy code

<table>
    <tr>
        <th>Item</th>
        <th>Quantity</th>
    </tr>
    <tr>
        <td>Apple</td>
        <td>50</td>
    </tr>
</table>

Combining Rows and Columns

Rowspan: A cell can span multiple rows using the <rowspan> attribute.

<table>
    <tr>
        <th rowspan="2">Fruit</th>
        <td>Apple</td>
    </tr>
    <tr>
        <td>Banana</td>
    </tr>
</table>

Colspan A cell can span multiple columns using the <colspan> attribute.

<table>
    <tr>
        <th colspan="2">Fruits</th>
    </tr>
    <tr>
        <td>Apple</td>
        <td>Banana</td>
    </tr>
</table>

Remember to always use proper semantic tags for better accessibility and readability!