• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号
登陆 注册

HTML 框架

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

HTML 框架

<iframe>标签规定一个内联框架。

　一个内联框架被用来在当前 HTML 文档中嵌入另一个文档。

　通过使用框架，你可以在同一个浏览器窗口中显示不止一个页面。

　iframe 语法：

<iframe src="URL"></iframe>

　该URL指向不同的网页，将窗口内容显示为URL地址指向页面。


Iframe - 设置高度与宽度

height和width属性用来定义iframe标签的高度与宽度。

属性默认以像素为单位, 但是你可以指定其按比例显示 (如："80%").

实例

<iframe src="demo_iframe.htm" width="80%" height="80%"></iframe>

尝试一下 »

Iframe - 移除边框

frameborder属性用于定义iframe表示是否显示边框。

　设置属性值为 "0" 移除iframe的边框:

实例

<iframe src="demo_iframe.htm" frameborder="0"></iframe>

尝试一下 »

使用 iframe 来显示目录链接页面

iframe可以显示一个目标链接的页面

　目标链接的属性必须使用iframe的属性，如下实例：

实例

<iframe src="demo_iframe.htm" name="iframe_a"></iframe>
<p><a href="http://www.ogeek.cn" target="iframe_a">W3CSCHOOL.CN</a></p>

尝试一下 »

HTML iframe 标签

标签 说明
<iframe> 定义一个内联的 iframe

iframe 标准属性

属性 说明
class
规定元素的类名（classname）
id 规定元素的唯一 id
style 规定元素的行内样式（inline style）
title 规定元素的额外信息（可在工具提示中显示）


HTML <frameset>标签 - HTML5 不支持

<frameset>标签在一个页面中设置一个或多个框架，用<frameset></frameset>代替了<body></body>，不能出现在body标签里。

　<frameset> 语法：

<frameset>

<frame src="menu.html">

<frame src="content.html">

</frameset>

  • frameset- 建立框架的标记，将在其中定义各个框架。
  • frame src- 指示框架显示内容URL地址。

<frameset> - 设置行列比例

<frameset>标签中我们使用rows设置行的占页面的百分比；cols设置列的所占百分比。

实例

<frameset rows="20%,*">

<frame src="title.html">

<frameset cols="30%,*">

<frame src="menu.html">

<frame src="content.html">

</frameset>

</frameset>


尝试一下 »
  • frameset cols- 确定每个框架列所占百分比。在前面的示例中，我们已经确定第一框架将占据所示区域的 30％，并且我们使用“*”符号来指示剩余百分比。
  • frameset rows- 确定将显示的每个框架行所占百分比。在前面的示例中，我们选择第一框架为 20％，剩下的剩余空间将在menu.html和content.html之间划分。

<frameset> - 设置边框 

　框架有一些边框线，大多数时候都不需要。<frameset>标签中我们使用frameborder和framespacing属性可以擦除它们。

注意：frameset和frameborder是相同的属性。

实例

<frameset border="0" frameborder="0" framespacing="0" rows="20%,*">

<frame src="title.html">

<frameset border="0" frameborder="0" framespacing="0" cols="30%,*">

<frame src="menu.html">

<frame src="content.html">

</frameset>

</frameset>


尝试一下 »
  • frameborder-设置边框， 0 值表示没有边框
  • border- 修改边框的粗细（由 Netscape 浏览器使用）
  • framespacing- 修改边框的粗细（由 Internet Explorer 浏览器使用）

<frame> - 设置名字 - HTML5 不支持 

<frame>标签中我们使用name属性命名每个框架，而不是内容页面。

实例

<frameset rows="20%,*">

<frame name="title" src="title.html">

<frameset cols="30%,*">

<frame name="menu" src="menu.html">

<name="content" src="content.html">

</frameset>

</frameset>


尝试一下 »

<frame> - 设置滚动

<frame>标签中我们使用noresize设置禁止用户拖拉框架大小；scrolling用于设置滚动条是否显示。

实例

<frameset border="2" frameborder="1" framespacing="2" rows="20%,*">

<frame src="title.html" noresize scrolling="no">

<frameset border="4" frameborder="1" framespacing="4" cols="30%,*">

<frame src="menu.html" scrolling="auto" noresize>

<frame src="content.html" scrolling="yes" noresize>

</frameset>

</frameset>


尝试一下 »
  • noresize- 不允许用户更改其尺寸。
  • scrolling- 设置滚动条是否显示。

鲜花
握手
雷人
路过
鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
More+
上一篇：
HTML 颜色发布时间：2022-01-31
下一篇：
HTML 表单发布时间：2022-01-31
热门推荐
More+
热门话题
More+
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服（服务时间 9:00～18:00）

在线QQ客服
地址：深圳市南山区西丽大学城创智工业园
电邮：jeky_zhao#qq.com
移动电话：139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap