5.6 Advanced Table Tags | Webmaster in a Nutshell, Third Edition

tags, tables, HTML,

tags, headers, table, tag, tag, tables, HTML, headers/footers, tag, columns, tags, tag, columns , tags, rules attribute, ">


Team-Fly

	Webmaster in a Nutshell, 3rd Edition By Robert Eckstein, Stephen Spainhour
	Table of Contents

	Chapter 5. Tables

5.6 Advanced Table Tags

While it is easy to build a simple table quickly with the tags we have described, you may desire more advanced table control such as varying border styles, running headers and footers, and column-based layout. HTML 4.0 adds new tags to accomplish these tasks , which originally appeared as extensions for Internet Explorer 3.0. Although they are defined in the latest standard, the latest browsers do not fully implement them. When making a table with these tags, make sure to test your tables on multiple browsers to ensure desired layout.

5.6.1 Table Section Tags

The three table section tags provide a way for you to break your table into logical sections: the header, body, and footer. You define the sections by placing the row tags (<tr>) within the <thead>, < tbody >, or < tfoot > tags. The usual attributes for controlling the placement of the contents can be used in these tags to set the alignment for the rows and cells they contain.

The main purpose for defining these sections is that when the table is printed or displayed in multiple sections, it will use consistent running headers and footers. Another benefit is that you can visibly delineate the sections by adjusting the size of the rules between them. Internet Explorer allows you to do this by supplying the rules attribute to the <table> tag with the values groups, rows, or all.

5.6.2 Column Grouping

Similar to the sectioning of tables by rows, you can also section tables by columns. You can define column groups to span a number of similar columns, or you can create them from dissimilar columns. Each column group is defined by the <colgroup> tag. <colgroup> tags should appear within <table> tags. They group columns specified by the table cell tags that appear in the rest of the table. Multiple column groups can be delineated with additional <colgroup> tags.

To create column groups of similar columns, use the span attribute to <colgroup>. For example:

 <colgroup span=2 width="25%"> <colgroup span=4 width="75%">

Here we create two groups. The first has two columns; the second has four. We have also used the common width attribute to set the relative widths of the columns. Other common attributes can be used here as well.

For groups of similar columns, place a <col> element for each within a <colgroup>. This example creates the same groups as above:

 <colgroup width="25%" >  <col>  <col> </colgroup> <colgroup width="75%">  <col>  <col>  <col>  <col> </colgroup>

By specifying columns with <col>, you can set specific attributes for the cells contained in that column.

To make the distinction between column groups when your table is displayed, use the rules attribute to draw rules between your groups. The values can be either groups, cols, or all.


Team-Fly

Top