-
让品牌有温度、有情感
专注品牌策划15年
iframe简单使用实例（iframe使用详解）
发布时间：2023-05-22 08:56:34
稿源：
创意岭 阅读：
58
大家好！今天让创意岭的小编来大家介绍下关于iframe简单使用实例的问题，以下是小编对此问题的归纳整理，让我们一起来看看吧。
开始之前先推荐一个非常厉害的Ai人工智能工具，一键生成原创文章、方案、文案、工作计划、工作报告、论文、代码、作文、做题和对话答疑等等
只需要输入关键词，就能返回你想要的内容，有小程序、在线网页版、PC客户端和批量生成器
本文目录:
怎样使用iframe，在网页中插入页面
首先，我们使用DreamWeaver新建一个站点，将我们需要归纳到一个页面的网页都包含在这个站点里面。2
然后我们找到一个需要嵌入页面的html文件，使用DW软件打开，找到需要插入页面的位置。
3
然后我们输入<iframe></iframe>标签。在前半个标签的里面，空格一下就会出现我们可以设置的属性。
4
我们需要设置src，即我们需要引用的页面的地址。并且，我们可以简单的设定一下我们的iframe框架的border以及是否有滚动条
5
除此之外，我们还应该设定这个iframe框架的宽度，一般来说我们都将其宽度设为100%，高度设为500px，由于在iframe标签内设置的宽和高都是具体值，我们需要给iframe一个class，然后设置style
6
这样一个iframe框架就嵌入到我们的网页当中了，我们可以按下ctrl+s，并按下F12，就可以在浏览器中查看效果图，我用红色框起来的部分就是我们嵌入的页面
怎样使用iframe，在网页中插入页面
第一步：需要建立两个页面1.html与2.html,把2.html插入1.html第二步：在1.html中使用<iframe></iframe>标签
例如：<iframe src=".../2.html"></iframe>
这样就插入了2.html页面。
拓展分析：
如果需要控制插入页面的大小等其他属性
例如：<iframe src=".../2.html" style="width:**px;height:**px;"></iframe>
如果需要嵌入的页面可以滚动，添加scrolling属性，yes为滚动，no相反；
例如：<iframe src=".../2.html" scrolling=no style="width:**px;height:**px;"></iframe>
如果需要设置这个嵌入网页的边框，则添加frameBorder属性
例如：<iframe src=".../2.html" frameBorder=0 scrolling=no style="width:**px;height:**px;"></iframe>
如果需要设置嵌入网页到边距的距离，添加属性marginwidth、marginheight等
例如：<iframe src=".../2.html" frameBorder=0 scrolling=no marginwidth=0 marginheight=0 style="width:**px;height:**px;"></iframe>
当然还有其他的属性，这个可以去网上查一下控制html网页的属性。
<iframe>的应用实例,简单点的
<iframe name="left" id="rightMain" src="left.html" frameborder="false" scrolling="auto" style="border:none;" width="100%" height="470" allowtransparency="true"></iframe><iframe name="right" id="rightMain" src="right.html" frameborder="false" scrolling="auto" style="border:none;" width="100%" height="470" allowtransparency="true"></iframe>
在left.html里放超链接 <a href='test.html' target="right">测试</a>
这样,在左边点击,就会在右边框架显示了
以上就是关于iframe简单使用实例相关问题的回答。希望能帮到你，如有更多相关问题，您也可以联系我们的客服进行咨询，客服也会为您讲解更多精彩的知识和内容。
推荐阅读：
赣公网安备 50019002502384号
