什么是 iFrame？

您可以将内嵌框架（或 iFrame）视为网页上的一个窗口，可查看另一段在线内容。更技术性的描述方式是将 HTML 文档嵌入到另一个 HTML 文档中。在代码方面，每个 iFrame 都包含<iframe> HTML 标签以及一个 src属性，以帮助指示您要嵌入网站的内容的位置。但是，您还可以合并其他属性来指定“窗口”本身的尺寸。

例如，下面是上面屏幕截图中简单示例 iFrame 的代码：

visible !important; position: static !important; text-align: left; width: auto !important; direction: ltr !important; box-shadow: none !important; display: inline !important; color: rgb(0, 0, 0) !important; letter-spacing: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: pre; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;"><iframe src="https://www.malanco.cn" height="630" width="1920"></iframe>

在这种情况下，<iframe>标记包括要显示的页面的 URL，以及以像素为单位的窗口的高度和宽度。您可以合并其他属性以启用功能策略 ( allow )、全屏模式 ( allowfullscreen )、付款 ( allowpaymentrequests ) 等。

需要注意的是，HTML5 不支持许多 iFrame 属性（例如scrolling）。

什么时候应该使用 iFrame？

iFrame 的主要目的是在您的网站上显示第三方内容。一些常见用途包括：

广告。许多侧边栏和横幅广告实际上是 iFrame。这使您的广告合作伙伴能够轻松提供和维护他们付费显示在您网站上的内容。

视频。利用 iFrame 在您的页面上显示托管在第三方平台上的视频，如爱奇艺、优酷上面的视频。

社交媒体帖子。显示您最近的社交媒体帖子的一种方法是通过 iFrame。这很方便，因为它们会自动更新以包含喜欢、评论和其他动态元素。

RSS订阅。就像不断变化的社交媒体帖子一样，RSS 提要有时更容易使用 iFrame 显示。您只需使用 RSS 提要 URL 作为 src属性。

使用 iFrame 有什么好处？

对于大多数用户来说，iFrame 是有益的，因为它们将主要 HTML 文档（您的站点）与您加载到其中的外部内容保持分离。这有两个原因。首先，您不必担心更新要显示的第三方内容，您的 iFrame 将加载最新版本。

此外，保持您的内容与其他网站的内容之间的分离可以提供额外的安全性。您不必担心通过将第三方代码直接添加到您站点的文件中而无意中导入任何漏洞或错误。

即便如此，仍有许多开发人员反对使用 iFrame，因为它们也会带来安全风险。您在“窗口”中加载的文档中的任何恶意元素也将在您的站点上可用。第三方可以借此机会“钓鱼”用户数据。