Table Example -- Source Code

HTML Page -- index.htm

<!DOCTYPE html>

<!-- Table Example 
     Source code file: index.htm
     A table with HTML5 elements. -->

<html>
    <head>
        <meta content="text/html; charset=utf-8" 
              http-equiv="Content-Type">
        <title>Details Example</title>
        <link rel="stylesheet" type="text/css" href="styles.css">
    </head>

    <body>
        <h1>Table Example</h1>

        <table>
            <thead>
                <tr> 
                    <th>Region</th> <th>Sales ($1000)</th>
                </tr>
            </thead>
            <tr> 
                <td>East</td> <td class="r">2,349</td>
            </tr>
            <tr> 
                <td>North</td> <td class="r">2,978</td>
            </tr>
            <tr> 
                <td>South</td> <td class="r">1,452</td>
            </tr>
            <tr> 
                <td>West</td> <td class="r">3,037</td>
            </tr>
            <tfoot>
                <tr> 
                    <td>Total</td> <td class="r">10,116</td> 
                </tr>
            </tfoot>
        </table>
    </body>
</html>

CSS Page -- styles.css

 /* Table Example
Source code file: styles.css
A table with HTML5 elements. */

body { background-color: #e0e0e0;
       color: #000060; 
font-family: Verdana, Arial, sans-serif; }
table { border-collapse: collapse; }
td, th { border: black solid 1px;
         padding: 5px; }
thead { background-color: #c0ffff; }
tfoot { background-color: #ffc0c0; }
.r { text-align: right; }