Tanda <iframe> HTML

课程推荐：

<iframe> 定义和用法

标签定义行内框架（内联框架）。

的样式（请参见下面的例子）。行内框架用于在当前 HTML 文档中嵌入另一个文档。 <iframe> 请使用 CSS 来设置

的样式（请参见下面的例子）。提示： <iframe> 最好始终为 <iframe> 内容的描述。

另请参阅：

HTML 教程：HTML Iframe

HTML DOM 参考手册：IFrame 对象

实例

例子 1

行内框架标记如下：

<iframe src="https://www.codew3c.com" title="CodeW3C.com 在线教程"></iframe>

亲自试一试

例子 2

添加并删除 iframe 的边框（使用 CSS）：

<iframe src="/index.asp" width="100%" height="300" style="border:1px solid black;">
</iframe>
<iframe src="/index.asp" width="100%" height="300" style="border:none;">
</iframe>

亲自试一试

属性

属性 值 描述
allow 定义 <iframe> 的功能策略。
allowfullscreen
  • true
  • false
 如果 <iframe> 可以通过调用 requestFullscreen() 方法激活全屏模式，则设置为 true。
allowpaymentrequest
  • true
  • false
 如果允许跨源 <iframe> 调用 Payment Request 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 定义要在 <iframe> 中显示的页面的 HTML 内容。
width 像素 定义 <iframe> 的宽度。默认宽度为 300 像素。

属性全局

<iframe> 标签还支持 HTML 中的全局属性。

事件属性

<iframe> 标签还支持 HTML 中的事件属性。

默认的 CSS 设置

大多数浏览器将使用以下默认值显示 <iframe> 元素：

iframe:focus {
  outline: none;
}
iframe[seamless] {
  display: block;
}

浏览器支持

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
支持 支持 支持 支持 支持