First things first. For this tutorial we will need a few html
documents. Fire up Notepad and copy the following to get you
started.
<HTML>
<HEAD>
<TITLE>My Frame Page</TITLE>
</HEAD>
<BODY>
</BODY>
</HTML>
We will give each document a name.
<HTML>
<HEAD>
<TITLE>My Frame Page</TITLE>
</HEAD>
<BODY>
Shameem
</BODY>
</HTML>
Create a new folder somewhere and save this as shameem.html.
(Windows 3.x users save it as shameem.htm)
Now make another html document.
<HTML>
<HEAD>
<TITLE>My Frame Page</TITLE>
</HEAD>
<BODY>
Sharf
</BODY>
</HTML>
Save this in the same folder as sharf.html.
Now do the same for Nows, Kassim, Sultan, and Kareem. Save
them just like the others. You should now have a folder that
contains 6 complete standalone html documents.
Ok, now the fun stuff... making your master page. Start with
this.
<HTML>
<HEAD>
<TITLE>My Frame Page- The Master Page</TITLE>
</HEAD>
<BODY>
</BODY>
</HTML>
Remove the <BODY> tags. The master page
doesn't use them...
<HTML>
<HEAD>
<TITLE>My Frame Page- The Master Page</TITLE>
</HEAD>
</HTML>
...it uses <FRAMESET> tags instead.
<HTML>
<HEAD>
<TITLE>My Frame Page- The Master Page</TITLE>
</HEAD>
<FRAMESET>
</FRAMESET>
</HTML>
To keep things a little cleaner, I'm going to stop writing
the <HTML>, <HEAD> and <TITLE>
tags. Needless to say, keep them in your document.
<FRAMESET>
</FRAMESET>
Now's a good time to save it. Save it in your folder as
index.html. If you try to open it with your browser
now it will be blank. All you have said so far is "This is
my Master Page".
Now let's start defining just how things are going to look.
Tell the browser to split the main window into 2 columns, each
occupying 50% of the window.
<FRAMESET COLS="50%,50%">
</FRAMESET>
This will still be blank, we have one more thing to do
before our 'system is operational'.
We must tell the browser what to put in each frame.
<FRAMESET COLS="50%,50%">
<FRAME SRC="shameem.html">
<FRAME SRC="sharf.html">
</FRAMESET>
VIEW
IT. You are now the proud parent of a fully
functional Framed page!
One last thing before we go on. Note that <FRAMESET>
is a container tag, and <FRAME> is
not. For those that don't know what that means, a container tag
has an opening <TAG> and a closing </TAG>.
<--BACK
NEXT-->
|