iFrame 或内联框架是一种 HTML 元素,允许开发人员或营销人员在当前 HTML 文档中嵌入外部文档。
当 iFrame 加载时,它包含用于提供动态内容(例如外部广告或交互式功能)的 JavaScript 代码。
iFrames 可以将各种类型的内容直接加载到网页中。该内容可能是:
- YouTube 视频
- 地图
- 社交媒体信息
- Web 应用程序
高度和宽度等属性可以帮助网页设计师 手机号数据库列表 控制 iFrame 显示的大小,以改善网站的视觉布局。
此外,可以应用 CSS“边框”来定制 iFrame 的外观,与周围的文本融合。
“iFrames”的示例
嵌入 YouTube 视频
内联框架可以有效地嵌入视频,增加用户参 以及两周半节奏和两周双倍节奏的流量 与度。开发人员可以使用 <iframe> 标签轻松插入多媒体内容。
“高度”和“宽度”属性控制显示尺寸,而全屏功能允许用户以全屏模式观看视频。
使用 iFrames 添加 YouTube 视频非常容易。只需从 YouTube 复制嵌入代码即可:
然后将代码粘贴到您想要在网站上嵌入视频的位置。
嵌入 Google 地图
内联框架可以嵌入 Google 地图等交互式元素,让用户直接在您的网站上探索位置。嵌入 Google 地图的方法如下:
“上面的示例使用了三个不同的[属性]:”
- allowfullscreen:对地图的某些部分启用全屏模式。
- frameborder=”0″和style=”border:0″:删除地图周围的默认 iframe 边框。
- referrerpolicy=”no-referrer-when-downgrade”:在 Referer 标头中发送完整的 URL,允许适当的 API 密钥限制。
以下是一家数字代理机构在其网站上使用 iFrames 展示 Google 地图的情况:
嵌入 PDF 文档
iFrame 可以直接在网页内显示 PDF 文档。因此,用户无需下载该文件。以下是嵌入 PDF 的代码的屏幕截图:
在上面的例子中,src 属性定义了 PDF 文件的位置,可以在网络上(使用 URL)或在本地服务器上(使用文件路径)。
嵌入“社交媒体帖子”(例如 Twitter)
您还可以使用 iFrames 在网页上嵌入社交媒体内容, 电子邮件线索带领 例如“推文”。它通过直接在您的网站上显示动态和交互式内容来增加参与度。