Styl tabulky CSS

Polstrování stolu

Chcete-li ovládat prostor mezi okrajem a obsahem v tabulce, použijte paddingvlastnost na prvcích <td> a <th>:

th, td {
padding: 15px;
text-align: left;
}

Přidejte border-bottomvlastnost k <th> a <td> pro horizontální oddělovače:

th, td {
border-bottom: 1px solid #ddd;
}

Pomocí :hovervoliče na <tr> zvýrazněte řádky tabulky najetím myši:

tr:hover {background-color: yellow;}

U pruhovaných tabulek použijte nth-child()selektor a přidejte a background-colordo všech sudých (nebo lichých) řádků tabulky:

tr:nth-child(even) {background-color: #f2f2f2;}

Níže uvedený příklad určuje barvu pozadí a barvu textu prvků <th>:

th {
background-color: #04AA6D;
color: white;
}