Now it is time to fiddle around a little bit, to get
used to the different ways that you can set up frames. So, try this:
<HEAD><TITLE>This is the Control Page</TITLE></HEAD>
<FRAMESET COLS="*,*">
<FRAMESET ROWS="*,50%">
<FRAME SRC="testone.html">
<FRAME SRC="testtwo.html">
</FRAMESET>
<FRAMESET ROWS="*,50%">
<FRAME SRC="testthree.html">
<FRAME SRC="testfour.html">
</FRAMESET>
</FRAMESET>
</HTML>
As you can see, that created four frames of equal size. Using the columns and rows
commands together can allow you to create all sorts of effects. Always remember though,
too many frames tend to be confusing. Design suggestion: Use them as a table of contents
or site map. Try not to use them too much, or the site looks bad and becomes too difficult
to navigate.
Now what if you don't like those borders? Well, let's get rid of them!
<HTML>
<HEAD><TITLE>This is the Control Page</TITLE></HEAD>
<FRAMESET COLS="*,*" >
<FRAMESET ROWS="*,50%">
<FRAME SRC="testone.html" FRAMEBORDER="NO">
<FRAME SRC="testtwo.html" FRAMEBORDER="NO">
</FRAMESET>
<frameset rows="*,50%">
<FRAME SRC="testthree.html" FRAMEBORDER="NO">
<FRAME SRC="testfour.html" FRAMEBORDER="NO">
</FRAMESET>
</frameset>
</HTML>
As you can see, there is a new command <FRAME FRAMEBORDER="yes/no">.
The default with frames is that there is a border, however with this command you can
rid your page of the borders. So, you must be wondering, why is there an option on
<FRAMEBORDER> that says
"yes"? Using the
"yes" modifier will
override any previous command. So, if you dont want borders except around a
particular frame, you can use the combination of commands to get what you want. Let's do
an example now.
<HTML>
<HEAD><TITLE>This is the Control Page</TITLE></HEAD>
<FRAMESET COLS="*,*" >
<FRAMESET ROWS="*,50%">
<FRAME SRC="testone.html" FRAMEBORDER="no">
<FRAME SRC="testtwo.html" FRAMEBORDER="no">
</FRAMESET>
<FRAMESET ROWS="*,50%">
<FRAME SRC="testthree.html" FRAMEBORDER="yes">
<FRAME SRC="testfour.html" FRAMEBORDER="no">
</FRAMESET>
</FRAMESET>
</HTML>
Now, just one of the frames has borders, while the rest are left empty.
However, it still looks real sloppy. Those scroll bars look strange just floating
there.
So, now it is time to get rid of those scroll bars. For
this we will use the
<FRAME
SCROLLING="yes/no/auto">
command. The "yes" command
always places the scroll bars in the frame, even if it doesnt need it. The
"no" command leaves out
the scroll bars, even if it does need it, and the
"auto" command only puts
them where they are needed. In this case, we want to
get rid of the scroll bars that are on the two frames that use them. We also want to get
rid of the borders that are still on. So.....
<HTML>
<HEAD><TITLE>This is the Control Page</TITLE></HEAD>
<FRAMESET COLS="*,*" >
<FRAMESET ROWS="*,50%">
<FRAME SRC="testone.html" FRAMEBORDER="NO">
<FRAME SRC="testtwo.html" FRAMEBORDER="NO" SCROLLING="NO">
</FRAMESET>
<FRAMESET ROWS="*,50%">
<FRAME SRC="testthree.html" FRAMEBORDER="NO" SCROLLING="NO">
<FRAME SRC="testfour.html" FRAMEBORDER="NO">
</FRAMESET>
</FRAMESET>
</HTML>
Now the scroll bars are gone. The "auto" setting is the default, so if you
put nothing, then that is the one that will be used by the browser.