<thead> for table header

The thead element marks one or more rows for the column labels.

 
<!DOCTYPE HTML> 
<html> 
<head> 
<title>Example</title> 
<style> 
thead th { text-align:left; background:grey; color:white} 
tbody th { text-align:right; background: lightgrey; color:grey} 
</style> 
</head> 
<body> 
    <table> 
        <thead> 
            <tr> 
                <th>Column Header</th><th>Column Header</th><th>Column Header</th><th>Column Header</th> 
            </tr> 
        </thead> 
        <tbody> 
            <tr> 
                <th>Row Header:</th><td>A</td><td>B</td><td>C</td> 
            </tr> 
            <tr> 
                <th>Row Header:</th><td>A</td><td>B</td><td>C</td> 
            </tr> 
            <tr> 
                <th>Row Header:</th><td>A</td><td>B</td><td>C</td> 
            </tr> 
        </tbody> 
    </table> 
</body> 
</html>
  
Click to view this demo.
Home 
  HTML CSS Book 
    HTML  

Related: