Lesson 4: The Tags

The Tags: <frameset ...> </frameset>

<frameset ...

Layout documents are different from contents documents in that they contain no <body> tags. Instead, the <body> tags are replaced with <frameset> tags. These <frameset> tags describe how the document area should be divided into frames through the name-value pairs rows=row_list or cols=column_list, which are mandatory parts (one or the other, but not both) of the <frameset> tag. Note that because it is possible to nest framesets within framesets (as we demonstrated in Lesson 1), the "document area" to be divided by a <frameset> tag may be either the entire browser window or just a frame created by an outer frameset.

... rows=row_list ...

A row list is a comma separated list of values which tells the browser how to divide the document area into rows. The width of these rows, of course, is just the width of the document area, but the height and number of rows is determined by the actual values in the list. The number of rows is, simply enough, just the number of values in the list. The height of the rows is determined by the values, which can be given in pixels, percentages, or relative weights:

value: value indicates the row height in pixels.
value%: value specifies the row height as a percentage of the document area's height (or the parent frame's height, if the frame is nested).
[value]*: value specifies the row height relative to other values marked by an asterisk. After space has been allocated for rows measured in pixels and percentages, the remaining space is divided among the rows specified by relative weights (i.e., marked by an asterisk). The number preceding the asterisk indicates the row's "weight" relative to other asterisk rows, if there are any; if the number is omitted, a default weight of 1 is assumed.

For example, if the row list in the <frameset> tag is "rows=30,25%,*,2*", then the document area will be divided into rows as follows:

There are four rows.
All rows have the same width, the width of the document area.
The top row, row 1, is 30 pixels high.
The height of the next row, row 2, is 25% of the document area's height.
The remaining document area is divided between rows 3 and 4, the bottom two rows. ¹/₃ of this space is awarded to row 3; ²/₃ of this goes to row 4. Put differently, rows 3 and 4 share the remaining space because they are asterisk rows, but row 4 must be twice the height of row 3.

Unfortunately, it is possible to specify a row list such that the total height of all rows is not equal to the document area's height. This kind of row list is called an improper row list, and though it is not necessarily bad, it can give unexpected results. The best way to avoid this problem is to 1) use common sense (more important than you might think) and 2) specify at least one row with an asterisk value. In fact, any row list containing a pixel value but no asterisk value must be improper. (See the section "Improper Frame Lists" in the next lesson for information on how browsers deal with improper row lists.)

... cols=column_list ...

By analogy, column lists work the same way as row lists, except that they specify column divisions rather than row divisions. (If this explanation doesn't satisfy you, then go back and reread the description for row lists, replacing the words row for column, column for row, width for height, height for width, top for left, and bottom for right.)

... border=pixels ...

Note: Microsoft, in its usual tradition of making things more confusing than they really need to be, has proposed two mechanisms for hiding borders. The first method is to set the frameset's frameborder property to "no":

frameborder=no

The second method is to set the framespacing property to 0:

framespacing=0

Although Internet Explorer 3 supports these two properties, I recommend that you do not use them -- unless, of course, you want to help Microsoft take over HTML and screw that up too. :-)

The border property is used to set the width, in pixels, of the dividing bar between frames in a frameset. If you want the border to go away entirely, set the border width to zero. The border property is new to Netscape 3 and is not supported by Internet Explorer 3 or older versions of Netscape.

... bordercolor= { "#rgb_triplet" ... color_name

If you choose to let your frame borders show, you can set their colors with the bordercolor property. The color must be specified as either an RGB triplet or as a common color name. For example, the tags

<frameset cols="*,*" bordercolor="#ffff00">

and

<frameset cols="*,*" bordercolor=yellow>

are equivalent.

The bordercolor property was first introduced in Netscape 3 and is not supported by older browsers.

Next: The Tags: <frame ...>

[ menu | previous page | next page ]