HTML Frames allow for more than one web page to be displayed in the same browser window. Each HTML document is called a frame, and each frame is independent of the others.
To add frames to a page, you would first encapsulate the frames within the <frameset> element. Within the <frameset> element, you place the self-closing (to be XHTML compliant) <frame> elements.
In a Frameset document, the outermost <frameset> element takes the place of <body> and immediately follows the start <head> element.
The <frameset> element contains one or more <frameset> or <frame> elements, along with an optional <noframes> element to provide alternate content for browsers that do not support frames or have frames disabled. A meaningful <noframes> element should always be provided and should at the very least contain links to the main frame or frames.
Note: This article is for informational purposes only. You should avoid the use of frames because they will not likely be supported by future browsers. At the moment, frames are only supported in HTML 4.01/XHTML 1.0 specification with a frameset doctype. XHTML 1.1 and HTML 5 do not support the use of frames.
Why use frames?
A classic example of why frames were used was when a navigation menu was placed in one frame, and content in another frame. When the user clicks a link on the menu, the web page that contained the contents would then be opened on the content frame.
Here is an example of a basic frameset with a menu frame on the left and a content frame on the right. Please note that the attribute name has been deprecated. You may want to use id in its place.
<frameset cols="25%,75%">
<frame name="menu" src="frame_menu.htm" />
<frame name="content" src="frame_content.htm" />
</frameset>
<noframes>
<body>
... html content ...
</body>
</noframes>The frameset can be split into rows or columns. The row or column size can be set in percentages (cols="25%,75%") and pixels (cols="250,750").
In addition, one of the columns can be set to use the remaining space, by specifying an asterisk (rows="25%,*"). In addition, you could nest framesets within frames so that you can create a page that includes rows and columns.
Frames can include the name attribute as shown in the example above. This can be helpful for hyperlinks that you create in your menu.htm file so that you can add the target attribute in your hyperlinks so that the content will be displayed in the contents frame.
For example, a link in your menu file may look like this:
<a href="doc1.htm" target="content" >Doc #1</a>Resizing and Scrolling
The normal state of a frame allows the dragging of frame borders, allowing the user to resize the frames. You can disable this option by adding the noresize attribute to your frames. The same applies to scrolling.
<frame name="menu" src="frame_menu.htm" noresize />
<frame name="content" src="frame_content.htm" scrolling="no" />Other optional attributes that you can use with frames are:
frameborder– (0/1)-Specifies whether or not to display a border around a framelongdesc– Specifies a page that contains a long description of the contentmarginheight– Specifies the top and bottom margins of a frame in pixelsmarginwidth– Specifies the left and right margins of a frame in pixels
Frame replacement?
Rather than using frames, a better option is to use a server-side scripting language such as asp.net or PHP. You will have better control and more flexibility to add windows and dynamic content to your pages. Alternatively, you can also use JavaScript.
The use of framesets and frames should be your last resort. While modern browsers still support the use of framesets and frames, newer HTML specifications have dropped support.
