Creating Frames


Example:
<html>
<head> <title> </title>
</head>

<frameset rows="90%,*">
<frame name="main" src="main.html">
<frame name="nav" src="navbar.html">
</frameset>

</html>

Break it down...


Set up a web page like you normally would, but don't include the <body> tags. The <frameset rows> tag creates the frames in rows. If you'd like columns, simply type <frameset cols="***">. I specified the widht of my rows in a percentage of the screen, but you can also specify in pixels (simply without any numerical ending, like cols="105, *"). The asterisk (*) tells the browser to use the rest of the screen for that frame. You can also have more than three frames by including more than two numbers.
Following the <frameset> tag is the <frame> tag. This tag specifies the name of the frame (important for coordinating which page shows up where) and the source of it, which is a completely different file. For instance, I'd have to create two new files with names main.html and navbar.html for this website. The other files are like normal HTML files. Don't forget to close your <frameset> tag!

Creating links to frames

Use the target attribute with the <a> tag to correctly target other frames.
Example:
<a href="URL HERE target="frame name here">Home</a>
If you do not specify a target, the link will show up in the same window. To have another website show up over your site, include target="_top" in your <a> tag.

Hide or display scrollbars

To hide scrollbars, type scrolling="no" in the <frame> tag.
To always display scrollbars, type scrolling="yes" in the <frame> tag.

Changing Frame Bordes

You can control both the width and the color of frame borders.
To control the color, simply type bordercolor="***" in the <frameset> tag.
To control the border width, type border="***" in the <frameset> tag.
To turn off borders, type border="0" in the <frameset> tag.

Creating Inline Frames

Inline frames, or iFrames, are my favorite type of frame. You can control their height and width, along with the other characteristics you can control with frames. An iFrame is pretty much a floating frame since you can stick them anywhere on the page.

How to use it:

<iframe src="home.html" name="main" height=350 width=350 frameborder=0> </iframe>
Don't forget to close your iFrame!