I have found that frames can be quite confusing and therefore I am going to keep the speed of this particular section quite slow.
2 FRAMES At first I will just discuss the idea behind splitting the browser window into two frames. To avoid all confusion I have created a diagram to show exactly what the browser window is:
The area outlined in red is what I refer to as the browser window. This can be split up into 2 frames in one of two ways - horizontally or vertically.
First of all I will show you what these frames look like, afterwards I will explain to you how they are created.
HORIZONTALLY (2 COLS)
You san see this page at http://www.usheen.com/s101_frs/cols.htm
VERTICALLY (2 ROWS)
You can see this page at http://www.usheen.com/s101_frs/rows.htm
The basic theory behind frames is that you have one master document, which contains, all the information about the layout of the frames and then each individual frames' content is contained in a separate document.
I will create two separate documents and then place them side by side in a single page using frames.
blue.htm
<html>
<body bgcolor=blue>
</body>
</html>
red.htm
<html>
<body bgcolor=red>
</body>
</html>
The above documents are very simple. They contain no information. All I have done is specify two different background colors. You can see the documents individually at http://www.usheen.com/s101_frs/blue.htm and http://www.usheen.com/s101_frs/red.htm and you can see them side by side at http://www.usheen.com/s101_frs/red_blue....
Now is probably the best time to show you how to create red_blue.htm.
The first important thing to remember is that in red_blue.htm you do not use <body> & </body> tags because this document does not actually have any content, its' sole purpose is to lay out the content of other documents.
Instead you will use <frameset> tags. For this example we will concentrate on separating the document into two rows. The initial code to do so is:
<html>
<head>
<title>Red & Blue Page</title>
</head>
<frameset rows="*,*">
</frameset>
</html>
The main part of the above document that might confuse you is probably :: rows="*,*" :: For now all you need to know is that this tells the browser to split the screen into two rows of equal size.
Now, in between the <frameset> and </frameset> tags you place the <frame> tags. These are standalone tags, one for each frame, in this case we need two.
 |
Go To Page: 1 2
