共计 1157 个字符，预计需要花费 3 分钟才能阅读完成。
在本教程中，您将学习如何使用 iframe 在另一个网页中显示网页。本文章包括 4 个知识点：什么是 iframe、设置 iFrame 的宽度和高度、删除默认边框和使用 iFrame 作为链接目标。
什么是 iframe
iframe 框架用于显示外部对象，包括网页内的其他网页。iframe 几乎就像网络浏览器中的迷你网络浏览器一样。此外，iframe 中的内容完全独立于周围元素而存在。
可以通过以下方式将 iframe 添加到网页中，其基本语法如下：
<iframe src ="URL"> </iframe>src属性中指定的 URL 指向外部对象或网页的位置。
以下示例使用 iframe 在当前文档中显示“hello.html”文件。
<iframe src="hello.html"></iframe>
设置 iFrame 的宽度和高度
height和 width 属性用于指定 iframe 的高度和宽度。
<iframe src="hello.html" width="400" height="200"></iframe>您还可以使用 CSS 设置 iframe 的宽度和高度，如下所示：
<iframe src="hello.html" style="width: 400px; height: 200px;"></iframe>请参阅 HTML 样式教程以了解将 CSS 应用于 HTML 元素的方法。
注意：width和 height 属性值默认以像素为单位，但您也可以按百分比设置这些值，例如 50%、100% 等。iframe 的默认宽度为 300 像素，而默认高度为 150 像素。
删除默认边框
默认情况下，iframe 周围有一个边框。但是，如果要修改或删除 iframe 边框，最好的方法是使用 CSS border属性。
下面的示例将简单地呈现没有任何边框的 iframe。
<iframe src="hello.html" style="border: none;"></iframe>同样，您可以使用该 border 属性将您选择的边框添加到 iframe。下面的示例将呈现带有 2 像素蓝色边框的 iframe。
<iframe src="hello.html" style="border: 2px solid blue;"></iframe>
使用 iFrame 作为链接目标
iframe 也可以用作超链接的目标。
可以使用 name 属性命名 iframe。这意味着当 target 单击具有该名称作为值的属性的链接时，链接的资源将在该 iframe 中打开。
让我们尝试一个示例来了解它的基本工作原理：
<iframe src="demo-page.html" name="myFrame"></iframe>
<p><a href="https://www.19web.com" target="myFrame">Open www.19web.com</a></p>