Column Frames
- Okay, let's look at an example of creating a frames document.
Specifically, let's divide a browser window into two columns.
- Since this is best explained by example, consider the following
code:
<HTML>
<HEAD>
<TITLE>Frame Column Example</TITLE>
<FRAMESET COLS = "100, 100">
<FRAME SRC = "afraid_icon.gif" NAME = "afraidFrame">
<FRAME SRC = "asterix_icon.gif" NAME = "asterixFrame">
<NOFRAME>
Well, if you do not have a frames capable browser,
this whole section will be meaningless. :(
</NOFRAME>
</FRAMESET>
</HEAD>
</HTML>
- On the web, the previous code would like the following figure.
Notice that we used two images for our frames, but we could easily
insert HTML documents or anything else that can be referenced with
SRC.
- Suppose we did not want to hardcode the frame size. The COLS
attribute also takes percentages as values to allow for a percentage-
based sizing. Thus, the previous code could be rewritten as the
following (notice we include one full URL as a frame and a relative
link as the other):
<HTML>
<HEAD>
<TITLE>Frame Column Example</TITLE>
<FRAMESET COLS = "50%, 50%">
<FRAME SRC = "http://www.eff.org/" NAME = "lFrame">
<FRAME SRC = "relative_link.html" NAME = "rFrame">
<NOFRAME>
Well, if you do not have a frames capable browser,
this whole section will be meaningless. :(
</NOFRAME>
</FRAMESET>
</HEAD>
</HTML>
- Finally, you can use an asterisk to specify the rest (of the available
rows or columns) as a
sizing component. Thus the following code would create three columns.
One column would be 25 pixels wide, one would be 25 pixels wide, and
the third would take up all the remaining space depending on how the
user resized the browser window.
<HTML>
<HEAD>
<TITLE>Frame Column Example</TITLE>
<FRAMESET COLS = "25, 25, *">
<FRAME SRC = "http://www.eff.org/" NAME = "lFrame">
<FRAME SRC = "relative_link.html" NAME = "rFrame">
<NOFRAME>
Well, if you do not have a frames capable browser,
this whole section will be meaningless. :(
</NOFRAME>
</FRAMESET>
</HEAD>
</HTML>
Additional Resources:
Creating Popup Browser Windows
Introduction to Web Design | Table of Contents
Row Frames
|
