html中iframe标签的用法 html中的iframe标签
大家好，感谢邀请，今天来为大家分享一下html中iframe标签的用法的问题，以及和html中的iframe标签的一些困惑，大家要是还不太明白的话，也没有关系，因为接下来将为大家分享，希望可以帮助到大家，解决大家的问题，下面就开始吧！
HTML中iFrame标签有哪些用法
这次给大家带来HTML中iFrame标签有哪些用法，在HTML中iFrame标签用法的注意事项有哪些，下面就是实战案例，一起来看一下。
最近工作有个在项目-布兜收藏夹。简言之就是将喜欢的图片收藏到布兜页面上来，这其中用到了很多关于iframe的方面，总结如下：
1.作为弹出层铺底覆盖
大家如果做过那种黑色遮罩盖住整张页面，而碰巧用户用的是IE6，更碰巧的是页面上有select元素，那就有得头疼了（原理就不在这里赘述了）。我们会发现弹出的DIV没法遮住select,轮到我们的iframe出场了。逻辑如下：
与弹出p同级放入iframe
保证iframe的 z-index小于弹层p z-index
增加window resize和scroll事件,保证iframe能盖住整张页面
部分代码
var iframe= U.isie6()?'<iframe style="position:absolute;left:0;top:0;z-index:2000000;filter:Alpha(opacity=0); width:100%;height:'+ ds.height+'" frameborder="0"></iframe>':'';
$container.append(iframe).appendTo($body);2.跨域写入cookie
有 a.com和b.com两个domain。在某些条件下b的部分功能会出现在a页面上。有时需要操作a页面的时候对b.com domain的cookie做一些操作以方便用户下次访问。我们只需要在a页面加入一个iframe(动态或固定)即可，src属性指向b的一张代理页面，在这张页面执行cookie操作即可。
相信看了这些案例你已经掌握了方法，更多精彩请关注Gxl网其它相关文章！
相关阅读：
HTML的代码书写有哪些规范
HTML你一定要知道的优化技巧
XHTML中有哪些常用的标签
HTML <iframe> 标签定义和用法
定义和用法：iframe元素会创建包含另外一个文档的内联框架（即行内框架）。
提示：您可以把需要的文本放置在<iframe>和</iframe>之间，这样就可以应对无法理解 iframe的浏览器。
属性①align
属性值：left、right、top、middle、bottom；
属性的作用：规定如何根据周围的元素来对齐此框架。
属性的说明：不赞成使用该属性。请使用样式代替。
属性②frameborder
属性值：1、0
属性作用：规定是否显示框架周围的边框。
属性③height
属性值：pixels、%
属性作用：规定 iframe的高度。
属性④longdesc
属性值：URL
属性作用：规定一个页面，该页面包含了有关 iframe的较长描述。
属性⑥marginheight
属性值：pixels
属性作用：定义 iframe的顶部和底部的边距。
属性⑦marginwidth
属性值：pixels
属性作用：定义 iframe的左侧和右侧的边距。
属性⑧name
属性值：frame_name
属性作用：规定 iframe的名称。
属性⑨scrolling
属性值：yes、no、auto
属性作用：规定是否在 iframe中显示滚动条。
属性（10）src
属性值：URL
属性作用：规定在 iframe中显示的文档的 URL。
属性（11）width
属性值：pixels、%
属性作用：定义 iframe的宽度。
关于HTML中的<iframe>的使用
一、Iframe标记的使用
Iframe标记，又叫浮动帧标记，你可以用它将一个HTML文档嵌入在一个HTML中显示。它不同于Frame标记最大的特征即这个标记所引用的HTML文件不是与另外的HTML文件相互独立显示，而是可以直接嵌入在一个HTML文件中，与这个HTML文件内容相互融合，成为一个整体，另外，还可以多次在一个页面内显示同一内容，而不必重复写内容，一个形象的比喻即“画中画“电视。
现在我们谈一下Iframe标记的使用。
Iframe标记的使用格式是:
<Iframe src="URL" width="x" height="x" scrolling="[OPTION]" frameborder="x"></iframe>
src：文件的路径，既可是HTML文件，也可以是文本、ASP等；
width、height："画中画"区域的宽与高；
scrolling:当SRC的指定的HTML文件在指定的区域不显不完时，滚动选项，如果设置为NO，则不出现滚动条；如为Auto：则自动出现滚动条；如为Yes，则显示;
FrameBorder：区域边框的宽度，为了让“画中画“与邻近的内容相融合，常设置为0。
比如:
<Iframe src="" width="250" height="200" scrolling="no" frameborder="0"></iframe>
二、父窗体与浮动帧之间的相互控制
在脚本语言与对象层次中，包含Iframe的窗口我们称之为父窗体，而浮动帧则称为子窗体，弄清这两者的关系很重要，因为要在父窗体中访问子窗体或相反都必须清楚对象层次，才能通过程序来访问并控制窗体。
1、在父窗体中访问并控制子窗体中的对象
在父窗体中，Iframe即子窗体是document对象的一个子对象，可以直接在脚本中访问子窗体中的对象。
现在就有一个问题，即，我们怎样来控制这个Iframe，这里需要讲一下Iframe对象。当我们给这个标记设置了ID属性后，就可通过文档对象模型DOM对Iframe所含的HTML进行一系列控制。
比如在example.htm里嵌入test.htm文件，并控制test.htm里一些标记对象：
<Iframe src="test.htm" id="test" width="250" height="200" scrolling="no" frameborder="0"></iframe>
test.htm文件代码为:
<html>
<body>
<h1 id="myH1">hello,my boy</h1>
</body>
</html>
如我们要改变ID号为myH1的H1标记里的文字为hello,my dear，则可用:
document.myH1.innerText="hello,my dear"(其中，document可省)
在example.htm文件中，Iframe标记对象所指的子窗体与一般的DHTML对象模型一致，对对象访问控制方式一样，就不再赘述。
2、在子窗体中访问并控制父窗体中对象
在子窗体中我们可以通过其parent即父（双亲）对象来访问父窗口中的对象。
如example.htm：
<html>
<body>
<Iframe name="tt" src="frame1.htm" width="250" height="200" scrolling="no" frameborder="0"></iframe>
<h1 id="myH2">hello,my wife</h1>
</body>
</html>
如果要在frame1.htm中访问ID号为myH2中的标题文字并将之改为"hello,my friend"，我们就可以这样写：parent.myH2.innerText="hello,my friend"
这里parent对象就代表当前窗体(example.htm所在窗体)，要在子窗体中访问父窗体中的对象，无一例外都通过parent对象来进行。
Iframe虽然内嵌在另一个HTML文件中，但它保持相对的独立，是一个“独立王国“哟，在单一HTML中的特性同样适用于浮动帧中。
试想一下，通过Iframe标记，我们可将那些不变的内容以Iframe来表示，这样，不必重复写相同的内容，这有点象程序设计中的过程或函数，减省了多少繁琐的手工劳动！另外，至关重要的是，它使页面的修改更为可行，因为，不必因为版式的调整而修改每个页面，你只需修改一个父窗体的版式即可了。
好了，关于html中iframe标签的用法和html中的iframe标签的问题到这里结束啦，希望可以解决您的问题哈！