HTML: The Definitive Guide

Previous Chapter 12
Frames
Next
 

12.6 Inline Frames

To this point, our discussion has centered around frames that are defined as part of a frameset. A frameset, in turn, replaces the conventional <body> of a document and supplies content to the user via its contained frames.

Internet Explorer let you do things a bit differently: You also can define a frame that exists within a conventional document, displayed as part of that document's text flow. These frames behave a lot like inline images, which is why they are known as inline frames.

The <iframe> Tag

Define an inline frame with the <iframe> tag.

The <iframe> tag is not used within a <frameset> tag. Instead, it appears anywhere in your document that an <img> tag could appear. The tag defines a rectangular region within the document in which the browser displays a separate HTML document, including scrollbars and borders.

Most of the attributes for the <iframe> tag, including the frameborder, marginheight, marginwidth, name, scrolling, and src attributes, behave exactly as the corresponding attributes for the <frame> tag. For further information on these attributes, see the section called "The <frame> Tag".

Use the content of the <iframe> tag to provide information to users of browsers other than Internet Explorer. Internet Explorer ignores these contents whereas all other browsers ignore the <iframe> tag and therefore display its contents as if it were regular body content. For instance, use the <iframe> content to explain to non-Internet Explorer users what they are missing:

...other document content
<iframe src="sidebar.html" width=75 height=200 align=right>
Your browser does not support inline frames.  To view this
<a href="sidebar.html">document</a> correctly, you'll need 
a copy of Internet Explorer.
</iframe>
...subsequent document content

In this example, we let the user know that they were accessing an unsupported feature, and provided a link to the missing content.

The align attribute

Like the align attribute for the <img> tag, this inline frame attribute lets you control where the frame gets placed inline with the adjacent text or moved to the edge of the document, allowing text to flow around the frame. [the section called "The align attribute"]

For inline alignment, use top, middle, or bottom as the value of this attribute. The frame will be aligned with the top, middle, or bottom of the adjacent text, respectively.

To allow text to flow around the inline frame, use the left or right values for this attribute. The frame will be moved to the left or right edge of the text flow, respectively, and the remaining content of the document will be flowed around the frame. This behavior is exactly like that of images whose align attribute has been set to left or right.

The height and width attributes

Internet Explorer puts the contents of an inline frame into a predefined, 150 pixel-tall, 300 pixel-wide box. Use the height and width attributes with values as the number of pixels to change those dimensions.

Using Inline Frames

Although you probably will shy away from inline frames for most of your web pages, they can be useful, particularly for providing information related to the current document being viewed, similar to the sidebar articles you'd find in a conventional printed publication. Unfortunately, a large component of your audience will not be able to view the inline frames, so make sure you include appropriate alternative content within the <iframe> and </iframe> tags to help those less fortunate viewers find the frame contents.

Except for their location within conventional document content, inline frames are treated exactly like regular frames. You can load other documents into the inline frame using its name (see following section) and link to other documents from within the inline frame.


Previous Home Next
The <noframes> Tag Book Index Named Frame or Window Targets

HTML: The Definitive Guide CGI Programming JavaScript: The Definitive Guide Programming Perl WebMaster in a Nutshell