Marusya's School Notes

Table Borders

The look of an HTML table can be greatly improved with CSS. To specify table borders in CSS, use the border property. The example below specifies a black border for <table>, <th>, and <td> elements:

HTML file:

Displayed by browser:

<body>
<table>
    <tr>
        <th>First Name</th>
        <th>Last Name</th>
    </tr>
    <tr>
        <td>Peter</td>
        <td>Griffin</td>
    </tr>
    <tr>
        <td>Lois</td>
        <td>Griffin</td>
    </tr>
</table>
</body>

First Name	Last Name
Peter	Griffin
Lois	Griffin

Notice that the table in the example above has double borders. This is because both the table and the <th>/<td> elements have separate borders. To display a single border for the table, use the border-collapse property.