HTML and CSS Reference
In-Depth Information
Figure 5-6
Viewing the Web table
table h
e
adings
table data
Trouble?
If your table looks different than Figure 5-6, you might have inserted
an incorrect number of table cells. Check your code against the code shown in
Figure 5-5.
The table you created for Kyle has three rows and eight columns. Remember that the
number of columns is determined by the maximum number of cells within each row. If
one row has four cells and another row has fi ve, the table will have fi ve columns. The row
with only four cells will have an empty space at the end, where the fi fth cell should be.
Adding a Table Border
By default, no gridlines are displayed in a Web table, making it diffi cult to see the table
structure. You decide the table would be easier to read with gridlines marking each cell
in the table. In the next session, you'll learn how to do this using CSS. But for now, you'll
use the HTML
border
attribute
<table border=”
value
”>
...
</table>
where
value
is the width of the table border in pixels. Figure 5-7 shows how different
border values affect the appearance of a sample table.
Figure 5-7
Tables with different border sizes
internal gridlines
have the same width
Note that the
border
attribute does not control the width of the internal gridlines that
separate individual table cells. However, to display internal gridlines, you must add a
border to the table. You can change the width of internal gridlines by changing the space
between table cells, an issue you'll examine in the next session.
