HTML and CSS Reference
In-Depth Information
Figure 5-35
Adding the border-collapse style
collapses adjacent borders in
the table into a singl e border
2. Save your changes to the style sheet and then reload schedule.htm in your Web
browser. Figure 5-36 shows the revised table design with the collapsed borders
Figure 5-36
Schedule table with collapsed borders
Notice that the browser still uses the purple outset style for the border around the
entire table. This is due to Rule 3 above. Because the border around the entire table is
10 pixels wide, it takes priority over the 1-pixel-wide borders around the individual table
cells under the collapsed borders model.
Applying Styles to Rows and Columns
Kyle doesn't like the appearance of the table text. He suggests changing it to a sans-
serif font that is 0.75 em units in size. He also suggests that the text in the header row
be displayed in a semi-transparent white font on a purple background, and that the fi rst
column of the schedule, which contains the program times, appear on a light yellow
You can apply these styles to the row groups and column groups you created in the last
session. Recall that the header row is part of the thead row group (see Figure 5-19), and
that the fi rst column of the table belongs to the fi rstCol class of columns (see Figure 5-20).
Search WWH ::

Custom Search