Style for table footer: background, color and font
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title></title>
<style type="text/css" title="text/css">
table {
border-top: 1px solid #c9c9c9;
border-left: 1px solid #c9c9c9;
}
caption {
padding: 0 0 10px;
font: bold 120% Arial, sans-serif;
text-transform: uppercase;
}
th {
text-align: left;
font-weight: bold;
}
th,td {
border-bottom: 1px solid #c9c9c9;
border-right: 1px solid #c9c9c9;
font: 80% Verdana, Arial, sans-serif;
padding: 2px 5px;
}
tfoot {
background-color: #666666;
color: #dddddd;
font-size: 80%;
}
table {
border: 1px solid #666666;
}
tfoot td {
border-bottom: 0;
border-right: 0;
}
</style>
</head>
<body>
<table width="90%" border="0" cellpadding="2" cellspacing="0" summary="A playlist">
<caption>
A list
</caption>
<thead>
<tr>
<th>S</th>
<th>T</th>
<th>A</th>
<th>A</th>
<th>P</th>
</tr>
</thead>
<tfoot>
<tr>
<td colspan="5">Music</td>
</tr>
</tfoot>
<tbody>
<tr><td>A</td><td>2:35</td><td>A</td><td>A</td><td>7</td></tr>
<tr><td>B</td><td>2:35</td><td>B</td><td>B</td><td>7</td></tr>
<tr><td>C</td><td>2:35</td><td>C</td><td>C</td><td>7</td></tr>
<tr><td>D</td><td>2:35</td><td>D</td><td>D</td><td>7</td></tr>
<tr><td>E</td><td>2:35</td><td>E</td><td>E</td><td>7</td></tr>
<tr><td>F</td><td>2:35</td><td>F</td><td>F</td><td>7</td></tr>
<tr><td>G</td><td>2:35</td><td>G</td><td>G</td><td>7</td></tr>
<tr><td>H</td><td>2:35</td><td>H</td><td>H</td><td>7</td></tr>
<tr><td>I</td><td>2:35</td><td>I</td><td>I</td><td>7</td></tr>
<tr><td>J</td><td>2:35</td><td>J</td><td>J</td><td>7</td></tr>
<tr><td>K</td><td>2:35</td><td>K</td><td>K</td><td>7</td></tr>
<tr><td>L</td><td>2:35</td><td>L</td><td>L</td><td>7</td></tr>
</tbody>
</table>
</body>
</html>
Related examples in the same category