HTML and CSS Reference
In-Depth Information
Next, you must decide whether you need to use a
rows
or
cols
attribute in your base
<frameset>
. Look at your storyboard—in this case Figure 17.15—and work out whether
any frame areas extend right across the screen or from the top to the bottom. If any
frames extend from the top to the bottom, as in this example, you need to start with a
cols
frameset; otherwise, you need to start with a
rows
frameset. On the other hand, if
no frames extend completely across the screen either vertically or horizontally, you
should start with a
cols
frameset.
To put it more simply, here are three easy-to-remember rules:
Left to right, use
rows
n
Top to bottom, use
cols
n
Can't decide, use
cols
n
17
NOTE
The reasoning behind the use of the “left to right, use
rows
” rule
relates to how frames-compatible browsers create frames. Each
separate
<frameset>
definition can split the screen (or a frame)
either vertically or horizontally, but not both ways. For this reason,
you need to define your framesets in a logical order to ensure that
you achieve the layout you want.
In Figure 17.15, the left frame extends across the screen from top to bottom. As a result,
you need to start with a
cols
frameset by using the rules mentioned previously. To define
the base frameset, enter the following:
<frameset cols=“125,*”>
<frame src=“choice.html”>
<!-- loads the choices page into the left frame -->
<frame src=“dummy.html”>
<!-- this line is only temporary -->
</frameset>
Writing this code splits the screen into two sections. The first line defines a small frame
at the left of the screen that is 125 pixels wide, and a large frame at the right of the
screen that uses the rest of the available space.
As mentioned earlier in this lesson, the frameset document itself doesn't describe the
contents of each frame. The documents specified in the
src
attribute of the
<frame>
actu-
ally contain the text, images, and tags displayed by the frameset. You can see an example
of this tag in the second and third lines of the preceding code. The second line specifies
the URL of the web page in the left frame (the
choice.html
page that you created ear-
lier). The third line would display a web page named
dummy.html
(if you created one,
that is), but we're just using this as a placeholder for the next exercise.
▲
