Simple example how to use table in html.
Table with th
<style>
table {
width: 100%;
}
td, th {
border: 1px solid #000;
text-align: center;
padding: 5px;
}
</style>
<table>
<tr>
<th>ID</th>
<th>Name</th>
<th>Country</th>
<th>Age</th>
</tr>
<tr>
<td>1</td>
<td>David</td>
<td>Unitad States</td>
<td>30</td>
</tr>
<tr>
<td>2</td>
<td>Oliver</td>
<td>Unitad States</td>
<td>35</td>
</tr>
<tr>
<td>3</td>
<td>Emma</td>
<td>United States</td>
<td>31</td>
</tr>
</table>
It will look like this
| ID |
Name |
Country |
Age |
| 1 |
David |
Unitad States |
30 |
| 2 |
Oliver |
Unitad States |
35 |
| 3 |
Emma |
Unitad States |
31 |
Change th color
<style>
table {
width: 100%;
}
td, th {
border: 1px solid #000;
text-align: center;
padding: 5px;
}
th {
background-color:#ddd;
}
</style>
<table>
<tr>
<th>ID</th>
<th>Name</th>
<th>Country</th>
<th>Age</th>
</tr>
<tr>
<td>1</td>
<td>David</td>
<td>Unitad States</td>
<td>30</td>
</tr>
<tr>
<td>2</td>
<td>Oliver</td>
<td>Unitad States</td>
<td>35</td>
</tr>
<tr>
<td>3</td>
<td>Emma</td>
<td>United States</td>
<td>31</td>
</tr>
</table>
It will look like this
| ID |
Name |
Country |
Age |
| 1 |
David |
Unitad States |
30 |
| 2 |
Oliver |
Unitad States |
35 |
| 3 |
Emma |
Unitad States |
31 |
Table with head and foot
<style>
table {
width: 100%;
}
td, th {
border: 1px solid #000;
text-align: center;
padding: 5px;
}
th {
background-color:#ddd;
}
</style>
<table>
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>Country</th>
<th>Age</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>David</td>
<td>Unitad States</td>
<td>30</td>
</tr>
<tr>
<td>2</td>
<td>Oliver</td>
<td>Unitad States</td>
<td>35</td>
</tr>
<tr>
<td>3</td>
<td>Emma</td>
<td>United States</td>
<td>31</td>
</tr>
</tbody>
<tfoot>
<tr>
<th>All: 3</th>
<th>Name</th>
<th>Country</th>
<th>Age</th>
</tr>
</tfoot>
</table>
It will look like this
| ID |
Name |
Country |
Age |
| 1 |
David |
Unitad States |
30 |
| 2 |
Oliver |
Unitad States |
35 |
| 3 |
Emma |
Unitad States |
31 |
| All:3 |
Name |
Country |
Age |
Example how to change table color with CSS
<style>
table {
width: 100%;
}
td, th {
border: 1px solid #000;
text-align: center;
padding: 5px;
}
th {
background-color:#ddd;
}