HTML Tutor - Getting Started
Part 4
All About Frames
Frames can be great. However, if used incorrectly, they can cause a lot of grief to your visitors and make your page look cluttered and, worst of all, ugly. Use the following tutorial and you'll have no problems with the second worst-used element of Web 'design' (the first begins with the letter 'B').
As with all HTML tags, frames have their own, and they begin with:
<FRAMESET></FRAMESET>
This is inserted before the <BODY> tags begin in the HTML file. It has the following options:
- ROWS="#, #" | "%, %" | "#*, *"
- COLS="#, #" | "%, %" | "#*, *"
The hashes (#) represent pixel sizes. For example: <FRAMESET ROWS="100,*"> would give you two frames--one being 100 pixels tall, the other filling in the rest.
The percentage (%) represents the percentage of width of the frame. For example, <FRAMESET COLS="25%,75%"> would give you two columns: one being 25 percent of the screen, the other being 75 percent.
The #*, * represents the first frame being a multiple of the size of the second. For example, <FRAMESET ROWS="2*, *"> would give you the first frame being twice the size of the second.
Now for the meat of the frames. The following tag defines what's inside each frame.
<FRAME><FRAME>
The frame tag defines each frame within the frameset. It includes the following attributes:
SRC="/path/to/file.html" tells the browser what to load inside this particular frame. You can also leave it blank or specify a picture.
NAME="x" allows a link in one frame to load its target in another frame. You can name it whatever you want.
NORESIZE renders your frame unresizable by viewers.
SCROLLING="yes/no/auto" the scrolling option allows you to define whether or not the frame can be scrolled through or not.
MARGINHEIGHT="x" defines the height of the margin in the individual frame. Values can be from 1 to whatever.
MARGINWIDTH="x" defines the width of the margin in the individual frame. Values can be from 1 to whatever.
FRAMEBORDER="x" defines whether or not there's a border between frames. Values can be from 0 in up.
FRAMESPACING="x" defines the frame spacing in each individual frame. Values can be from 0 on up. These can make a page look like it doesn't use frames.
What if someone has a browser that doesn't support frames? Add this after all of your frame tags:
<NOFRAMES></NOFRAMES>
After this tag you can put your <BODY> tag like you normally would. This tag comes into play if the user has an older browser -- they can still see the page, just without frames. This tag has no options.
TARGET="name"
The TARGET value allows you to load files in other frames. It appears in the HTML file itself.
Let's say you want a link from frame #1 to load a page in frame #2. <FRAMESET COLS="150, *"> <FRAME HREF="file1.html" NAME="#1"> <FRAME HREF="file2.html" NAME="#2"> </FRAMESET> You would make your links in file1.html look like this:
<A HREF="file.html" TARGET="#2">
and you would have file2.html include the following after the <BODY> tag:
<BASE TARGET="#2">
The <TARGET> tag can also include one of the following attributes:
TARGET="_self" allows the file to load in the same frame.
TARGET="_parent" allows the file to load in the same frameset.
TARGET="_blank" allows the file to load in a new blank window.
TARGET="_top" the link will load completely outside of the frames without starting a new instance of the browser.
|
