Style for table footer : tfoot « Tags « HTML / CSS






Style for table footer

   

<!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" media="Screen">
table.example1 tfoot {
  background: red;
  color: white;
}

</style>
</head>
<body>
<h2>Row Groups</h2> 

<table class="example1"> 
    <thead> <tr> <th>thead</th> <th>2 </th> <th>3 </th> <th>4 </th> </tr> </thead> 
    <tfoot> <tr> <th>tfoot</th> <td>10</td> <td>11</td> <td>12</td> </tr> </tfoot> 
    <tbody> <tr> <th>tbody</th> <td>6 </td> <td>7 </td> <td>8 </td> </tr> </tbody> 

</table> 



</body>
</html>

   
    
  








Related examples in the same category

1.'tfoot' defines table footer
2.table header foot
3.Table footer style
4.Only header and footer have border
5.Add extra row to the footer
6.tfoot tag is the last section of a table, which formats the table footer
7.Style for table footer: background, color and font
8.Selecting cells in foot
9.tfoot td border: thin solid black;text-align: center;font-weight: bold;
10.tfoot th, tfoot td {border-top: 2px solid #666; color: #363;}