Harvard Extension School
CSCI E-12 Fundamentals of Web Site Development | Spring 2020

## Tables

See: Tabular Data from HTML5 Specification

### Uses of Tables

- Data
- Layout

### Table Elements

`table` , `caption` , `colgroup` , `col` , `tbody` , `thead` , `tfoot` , `tr` , `td` , `th`

Example 3.23 - Table - Example 3.23 | Example 3.23 JSFiddle

- Markup
- Display

    <table>
    <caption>A table</caption>
    <tr>
    <th>Column 1</th>
    <th>Column 2</th>
    <th>Column 3</th>
    </tr>
    <tr>
    <td>row 1 column 1</td>
    <td>row 1 column 2</td>
    <td>row 1 column 3</td>
    </tr>
    <tr>
    <td>row 2 column 1</td>
    <td>row 2 column 2</td>
    <td>row 2 column 3</td>
    </tr>
    <tr>
    <td>row 3 column 1</td>
    <td>row 3 column 2</td>
    <td>row 3 column 3</td>
    </tr>
    </table>

A table
Column 1 | Column 2 | Column 3
--- | --- | ---
row 1 column 1 | row 1 column 2 | row 1 column 3
row 2 column 1 | row 2 column 2 | row 2 column 3
row 3 column 1 | row 3 column 2 | row 3 column 3

Copyright © David Heitmeyer