1、iframe 定义和用法
iframe 元素会创建包含另外一个文档的内联框架(即行内框架)。
HTML 与 XHTML 之间的差异
在 HTML 4.1 Strict DTD 和 XHTML 1.0 Strict DTD 中,不支持 iframe 元素。
提示:a.您可以把需要的文本放置在 <iframe> 和 </iframe> 之间,这样就可以应对无法理解 iframe 的浏览器。
b.iframe标签是成对出现的,以<iframe>开始,</iframe>结束
c.iframe标签内的内容可以做为浏览器不支持iframe标签时显示
iframe的属性
属性 | 值 | 描述 | DTD |
---|---|---|---|
align |
| 不赞成使用。请使用样式代替。 规定如何根据周围的元素来对齐此框架。 | TF |
frameborder |
| 规定是否显示框架周围的边框。 | TF |
height |
| 规定 iframe 的高度。 | TF |
longdesc | URL | 规定一个页面,该页面包含了有关 iframe 的较长描述。 | TF |
marginheight | pixels | 定义 iframe 的顶部和底部的边距。 | TF |
marginwidth | pixels | 定义 iframe 的左侧和右侧的边距。 | TF |
name | frame_name | 规定 iframe 的名称。 | TF |
scrolling |
| 规定是否在 iframe 中显示滚动条。 | TF |
src | URL | 规定在 iframe 中显示的文档的 URL。 | TF |
width |
| 定义 iframe 的宽度。 | TF |
iframe透明度
iframe的底色是白色的,不同浏览器可能有不同颜色,如果你主页有整体的背景色,那么iframe区域可能是一个白色块,这时就需要iframe透明。
iframe透明的方法是添加属性allowtransparency="true" style="background-color=transparent"
例如:
<div class="content-space">
<iframe id="iframe" name="iframe" src="home.html" style="width:100%;height:100%;background-color:transparent;"
allowtransparency="true" frameborder="0" scrolling="no"></iframe>
</div
function iframeHeight(){
var iframe= document.getElementById("iframe");
var subWeb = document.frames ? document.frames["iframe"].document : iframe.contentDocument;
if(iframe != null && subWeb != null) {
iframe.height = subWeb.body.scrollHeight;
}
}
需要为iframe添加οnlοad=“iframeHeight();”事件。iframe的contentDocment属性只有IE8和之上的浏览器才兼容,IE6,IE7不兼容。