Tables, like any HTML element, can be styled using CSS.
Some commonly used CSS properties for tables are:
An example of a table with 2 cells across 3 rows is:
Header 1 | Header 2 |
---|---|
Content 1 of row 2 | Content 2 of row 2 |
Content 1 of row 3 | Content 2 of row 3 |
Footer 1 of row 4 | Footer 2 of row 4 |
Let's apply the CSS rules:
<style>
table, td, th {border:1px solid black; padding:15px}
td {color:purple}
</style>
Let's apply more CSS rules:
<style>
table {width: 60%;}
table, td, th {
border-collapse: collapse;
border:1px solid black;
padding:15px;
text-align: center;
padding: 8px;
}
td {color:purple}
th {
background-color: blue;
color: white;
}
</style>