HTML <iframe> 标签
更多“自己尝试一下”示例见下方。
定义和用法
The <iframe> 标签指定一个内联框架。
内联框架用于在当前 HTML 文档中嵌入另一个文档。
提示： 使用 CSS 样式化 <iframe>（见下方示例）。
提示： 最佳实践是在 <iframe> 中始终包含 title 属性。屏幕阅读器使用它朗读 <iframe> 的内容。
浏览器支持
| 元素 | |||||
|---|---|---|---|---|---|
| <iframe> | 是 | 是 | 是 | 是 | 是 |
属性
| 属性 | 值 | 描述 |
|---|---|---|
| allow | 指定 <iframe> 的功能策略 | |
| allowfullscreen | true false |
如果 <iframe> 可以通过调用 requestFullscreen() 方法激活全屏模式，则设置为 true |
| allowpaymentrequest | true false |
如果允许跨源 <iframe> 调用支付请求 API，则设置为 true |
| height | 像素 | 指定 <iframe> 的高度。默认高度为 150 像素 |
| loading | eager lazy |
指定浏览器是否应立即加载 iframe 或延迟加载 iframe 直到满足某些条件 |
| name | 文本 | 指定 <iframe> 的名称 |
| referrerpolicy | no-referrer no-referrer-when-downgrade origin origin-when-cross-origin same-origin strict-origin-when-cross-origin unsafe-url |
指定在获取 iframe 时发送哪些推荐人信息 |
| sandbox | allow-forms allow-pointer-lock allow-popups allow-same-origin allow-scripts allow-top-navigation |
为 <iframe> 中的内容启用额外的限制集 |
| src | URL | 指定要嵌入到 <iframe> 中的文档的地址 |
| srcdoc | HTML_code | 指定要显示在 <iframe> 中的页面的 HTML 内容 |
| width | 像素 | 指定 <iframe> 的宽度。默认宽度为 300 像素 |
全局属性
The <iframe> 标签还支持 HTML 中的全局属性.
事件属性
The <iframe> 标签还支持 HTML 中的事件属性.
更多示例
示例
添加和删除 iframe 边框（使用 CSS）
<iframe src="/default.asp" width="100%" height="300" style="border:1px solid black;">
</iframe>
<iframe src="/default.asp" width="100%" height="300" style="border:none;">
</iframe>
自己尝试一下 »
相关页面
HTML 教程：HTML Iframes
HTML DOM 参考：IFrame 对象
默认 CSS 设置
大多数浏览器将使用以下默认值显示 <iframe> 元素
iframe:focus {
outline: none;
}
iframe[seamless] {
display: block;
}
