LECTURE-3
HTML Tables: Rows, Columns, and Advanced Attributes
In HTML, tables are structured using rows (`<tr>`) and columns (`<td>` for regular cells or `<th>` for
header cells). The `colspan` and `rowspan` attributes allow cells to span multiple columns or rows,
respectively, aiding in more complex table layouts. Here's how each of these attributes works:
1. **Row (`<tr>`) and Column (`<td>` or `<th>`)**:
- `<tr>`: Defines a row in a table.
- `<td>`: Defines a standard data cell in a table.
- `<th>`: Defines a header cell in a table.
2. **`colspan` Attribute**:
- `colspan` specifies the number of columns a cell should span.
- It's an attribute of `<td>` or `<th>` elements.
- Example:
```html
<table border="1">
<tr>
<td>Row 1, Cell 1</td>
<td colspan="2">Row 1, Cell 2 and Cell 3 combined</td>
</tr>
<tr>
<td>Row 2, Cell 1</td>
<td>Row 2, Cell 2</td>
<td>Row 2, Cell 3</td>
</tr>
</table>
```
In this example, the second cell in the first row spans two columns.
3. **`rowspan` Attribute**:
- `rowspan` specifies the number of rows a cell should span.
- It's also an attribute of `<td>` or `<th>` elements.
- Example:
```html
<table border="1">
<tr>
<td rowspan="2">Row 1, Cell 1 and Row 2, Cell 1 combined</td>
<td>Row 1, Cell 2</td>
</tr>
<tr>
<td>Row 2, Cell 2</td>
</tr>
</table>
```
In this example, the first cell spans two rows.
These attributes provide flexibility in designing complex table structures, allowing cells to stretch across
multiple rows or columns.