CSS Tutorial
CSS Tables
CSS allows you to style HTML tables to improve readability and appearance. You can control borders, spacing, padding, colors, and more. Key properties include:
- border: Sets border style for table, rows, and cells.
- border-collapse: Combines adjacent borders into a single border (collapse) or keeps them separate (separate).
- padding: Adds space inside table cells.
- text-align: Aligns text inside cells.
- background-color: Adds color to table, rows, or cells.
- nth-child(): Styles alternating rows or columns.
Example
| Property | Description | Example |
|---|---|---|
| border | Defines table borders | border: 2px solid black; |
| border-collapse | Combines adjacent borders | border-collapse: collapse; |
| padding | Adds space inside cells | padding: 10px; |
| text-align | Aligns text inside cells | text-align: center; |
| background-color | Changes background color of table/row/cell | background-color: lightblue; |
This example demonstrates how to make tables readable and visually appealing.