HTML and CSS Reference
In-Depth Information
TABLE 17.3
Continued
Attribute
Description
The URL for a page containing a long description of the contents of the
iframe.align
. As with the
<img>
tag, specifies the positioning of the
frame with respect to the text line in which it occurs. Possible values
include
left
,
middle
,
right
,
top
, and
bottom
, which is the default
value.
absbottom
,
absmiddle
,
baseline
, and
texttop
are available as
Internet Explorer extensions. Deprecated in favor of CSS.
longdesc
Because you know how to use both regular frames and inline images, using the
<iframe>
tag is fairly easy. The following code displays one way to use the Away from My Desk
pages with a floating frame. In this example, you begin by creating a page with a red
background. The links that the user clicks appear on a single line, centered above the
iframe. For clarity, I've placed each of the links on a separate line of code.
Following the links (which target the floating frame named
“reason”
), the code for the
floating frame appears within a centered
<div>
element. As you can see in the HTML
below, the floating frame will be centered on the page and will measure 450 pixels wide
by 105 pixels high:
Input
▼
<!DOCTYPE html>
<html>
<head>
<title>
I'm Away From My Desk
</title>
<style type=”text/css” media=”screen”>
body { background-color: #ffcc99; }
</style>
</head>
<body>
<h1>
I'm away from my desk because ...
</h1>
<p style=”text-align: center”>
<a href=”reason1.html” target=”reason”>
Reason 1
</a>
|
<a href=”reason2.html” target=”reason”>
Reason 2
</a>
|
<a href=”reason3.html” target=”reason”>
Reason 3
</a>
|
<a href=”reason4.html” target=”reason”>
Reason 4
</a>
|
<a href=”reason5.html” target=”reason”>
Reason 5
</a>
|
<a href=”reason6.html” target=”reason”>
Reason 6
</a>
</p>
<div style=”margin: 0 auto; width: 450px;”>
<iframe name=”reason” src=”reason1.html” style=”width: 450px; height:
105px”></iframe>
</div>
</body>
</html>
