Tables - Web Development and Design Foundations with XHTML - page 312

8.1 Using Tables on Web Pages
Tables are commonly used on Web pages in two ways:
● To organize information
● To format the layout of an entire Web page
Although it is increasingly common to use CSS to configure page layout, some well-
known sites, such as http://www.yankeecandle.com, http://www.league.org, and
http://www.craigslist.org use the older method of XHTML tables for this function.
Overview of an XHTML Table
An XHTML table is composed of rows and columns, like a spreadsheet. Each individual
table cell is at the intersection of a specific row and column. Each table begins with a
<table> tag and ends with a </table> tag. There are a number of optional attributes
for the <table> element, such as border , width , summary , cellspacing , and
cellpadding . Each table row begins with a <tr> tag and ends with a </tr> tag. Each
cell (table data) begins with a <td> tag and ends with a </td> tag. Table cells can con-
tain text and graphics. In fact, table cells usually contain other XHTML tags such as
paragraphs, headings, and tables. Be very careful to use opening and closing tags when
working with tables. If you omit or misplace a tag the results are unpredictable and
your page may not display at all. Figure 8.1 shows a sample table with three rows, four
columns, and a border.
Figure 8.1
Table with three
rows, four columns,
and a border
The following is the sample XHTML code for the table shown in Figure 8.1:
<table border="1" >
<tr>
<td>Name</td>
<td>Birthday</td>
<td>Phone</td>
<td>E-mail</td>
</tr>
<tr>
<td>Jack</td>
<td>5/13</td>
<td>857-555-5555</td>
<td>[e-mail]</td>
</tr>
<tr>
<td>Sparky</td>
<td>11/28</td>
<td>303-555-5555</td>
<td>[e-mail]</td>
</tr>
</table>