HTML <iframe> 标签
下面有更多实例。
定义和用法
<iframe>
标签规定一个内联框架。
一个内联框架被用来在当前 HTML 文档中嵌入另一个文档。
提示: 使用 CSS 为 <iframe>
(包括滚动条)定义样式。
提示: 您可以把需要的文本放置在 <iframe> 和 </iframe> 之间,这样就可以应对不支持 <iframe> 的浏览器。
浏览器支持
元素 | |||||
---|---|---|---|---|---|
<iframe> | Yes | Yes | Yes | Yes | Yes |
属性
属性 | 值 | 描述 |
---|---|---|
allow | 指定 <iframe> 其特征策略 | |
allowfullscreen | true false |
设置为true时,可以通过调用 <iframe> 的 requestFullscreen() 方法激活全屏模式。 |
allowpaymentrequest | true false |
设置为true时,跨域的 <iframe> 就可以调用 Payment Request API |
height | pixels | 规定 iframe 的高度。 默认值为 150 像素 |
name | text | 规定 <iframe> 的名称。 |
referrerpolicy | no-referrer no-referrer-when-downgrade origin origin-when-cross-origin same-origin strict-origin strict-origin-when-cross-origin unsafe-url |
表示在获取 iframe 资源时如何发送 referrer 首部 |
sandbox | allow-forms allow-pointer-lock allow-popups allow-same-origin allow-scripts allow-top-navigation |
在 iframe 框架中的内容启用一些额外的限制条件。 |
src | URL | 被嵌套的页面的 URL 地址。使用 about:blank 值可以嵌入一个遵从同源策略的空白页。 |
srcdoc | HTML_code | 该属性是一段 HTML 代码,这些代码会被渲染到 iframe 中。 |
width | pixels | 规定 <iframe>的宽度。默认值是 300 像素 |
全局属性
<iframe>
标签支持 HTML 中的全局属性。
事件属性
<iframe>
标签支持 HTML 中的事件属性。
更多实例
实例
添加和删除 iframe 边框 (使用 CSS):
<iframe src="/default.php" width="100%" height="300" style="border:1px solid
black;">
</iframe>
<iframe src="/default.php" width="100%" height="300" style="border:none;">
</iframe>
亲自试一试 »
</iframe>
<iframe src="/default.php" width="100%" height="300" style="border:none;">
</iframe>
相关页面
HTML 教程: HTML Iframes
HTML DOM 参考手册: IFrame 对象
默认CSS设置
大多数浏览器将使用以下默认值显示 <iframe>
元素:
iframe:focus {
outline: none;
}
iframe[seamless] {
display: block;
}
outline: none;
}
iframe[seamless] {
display: block;
}