错误博客（ cuowu.com ）发布于 2019-06-04 23:04:48
HTML框架
<frameset></frameset>，<frame />，<iframe></iframe>，HTML框架结构，frame标签教程。
框架集标签
语法：<frameset></frameset>
注：Frameset元素是Frame元素的容器，html文档可包含frameset元素或body元素之一，而不能同时包含两者。但可以在<noframe></noframe>标签
中加入<body></body>标签。
<frameset>属性如下几点：
- 水平分割窗口 <frameset rows=”框架高度,框架高度,….”>
高度单位：PX或者百分比
例如：
<frameset rows=”100%,100%”>
<frame src=”1.html” name=”frame1″ />
<frame src=”2.html” name=”frame2″/>
</frameset>
- 垂直分割窗口 <frameset cols=”框架宽度，框架宽度,….”>
例如：
<frameset cols=”100%,100%”>
<frame src=”1.html” name=”frame1″ />
<frame src=”2.html” name=”frame2″/>
</frameset>
- 嵌套分割
第一个frameset对整体分割
第二个frame对第一次水平分割的下（右）部继续分割
当然如果继续嵌套分割原理也是一样的。
例如：
<frameset rows=”100%,100%”>
<frame src=”1.html” name=”1″ />
<frameset cols=”100%,100%”>
<frame src=”表格.html” name=”2″/>
<frame src=”表单.html” name=”3″/>
</frameset>
</frameset>
- 框架边框 <frameset frameborder=”是否显示”>
值：yes，no，或者1和0。1和yes显示，no或0不表示。
例如：
<frameset frameborder=”yes” rows=”100%,100%”>
<frame src=”1.html” name=”1″ />
</frameset>
- 框架边框宽度 <frameset framespacing=”边框宽度”>
宽度单位：PX。默认为1，只对框架集有效，对单个框架无效。
火狐和谷歌不支持，IE8支持。
例如：
<frameset frameborder=”yes” framespacing=”2px” rows=”100%,100%”>
<frame src=”1.html” name=”1″ />
</frameset>
- 框架边框颜色 <frameset bordercolor=”颜色”>
例如：
<frameset bordercolor=”red” rows=”100%,100%”>
<frame src=”1.html” name=”1″ />
</frameset>
窗口
语法：<frame />
Frame属性如下几点：
- HTML文件地址：src
例如：
<frame src=”1.html” name=”1″ />
- HTML文件名称：name
便于页面查找提供的属性，只能是单词字母组合。
例如：
<frame src=”1.html” name=”1″ />
- 禁止调整窗口尺寸：noresize
设置该属性后，将无法通过拖拽实现调整窗口效果。
例如：
<frame src=”1.html” name=”1″ noresize />
- 边框与页面内容水平边距：marginwidth
例如：
<frame src=”1.html” name=”1″ marginwidth=”100” />
- 边框与页面内容垂直边距：marginheight
例如：
<frame src=”1.html” name=”1″ marginheight=”100” />
- 控制框架滚动条显示：scrolling
Scrolling三种取值：yes no auto。
Yes 一直显示滚动条；
No 无论什么时候都不会显示滚动条；
Auto 根据具体内容，当超出浏览器窗口范围，自动显示（系统默认）
IE8支持的，但是其他的可能支持性不好。
例如：
<frame src=”1.html” name=”1″ scrolling=”no” />
- 不支持框架：noframes
如果遇到不支持框架结构的浏览器，或者用户关闭了浏览器的框架显示功能，此时就需要用<noframes>来设置替换的内容，告诉读者浏览器无法打开
框架页面。
例如：
<noframes>对不起，您的浏览器不支持框架效果！</noframes>
浮动框架
语法：<iframe></iframe>
浮动框架<iframe>标签，它是一种特殊的框架，整个页面并不一定是框架页面，但要包含一个框架窗口（frameset则整个页面都是框架，不能有body
前面已经介绍过了。 ）。<iframe>可以放在页面的任何位置。
语法上也不同，iframe是双标签，而frame是单标签。
浮动框架<iframe>属性如下：
- 页面源文件：src
例如：
<iframe src=”1.html” ></iframe>
- 浮动框架宽度：width
例如：
<iframe src=”1.html” width=”100” ></iframe>（宽高单位均为PX）
- 浮动框架高度：height
例如：
<iframe src=”1.html” height=”100” ></iframe>（宽高单位均为PX）
- 浮动框架对齐方式：align
两种方式：left、right即左、右。默认left。
例如：
<iframe src=”1.html” align=”left” ></iframe>
- 浮动框架滚动条显示属性：scrolling
三种方式：auto、yes、no，即自动显示、一直显示、不显示
例如：
<iframe src=”1.html” scrolling=”yes” ></iframe>
创建框架链接
框架链接之间是通过target相互链接起来的，其中应用最广泛的就是导航。
普通框架链接步骤：
a) 创建框架链接页面，这里命名为：frame链接演示页.html
这里呢，footer.html 可以是任何一个详细页，也可不填，等于顶部空白。
注意：footer.html和top.html不能相同，导航页target需链接到footer名。
代码如下：
<!DOCTYPE html>
<html>
<head>
<title>框架链接演示</title>
</head>
<frameset rows=”200,*” frameborder=”1″>
<frame src=”top.html” name=”top”> 这两个name不能一样
<frame src=”footer.html” name=”footer”>
</frameset>
</html>
b) 创建导航页，这里命名为：top.html
代码如下：
<!DOCTYPE html>
<html>
<head><title>top</title></head>
<body>
<table align=”center”>
<tr>
<td width=”100″ height=”200″><a href=”新闻.html” target=”footer” >新闻</a><td>
<td width=”100″><a href=”图片.html” target=”footer” >图片</a><td>target为footer
<td width=”100″><a href=”贴吧.html” target=”footer”>贴吧</a><td>
</tr>
</table>
</body>
</html>
c) 创建几个底部详细页，这里命名为：新闻.html 图片.html 贴吧.html
代码如下：
<!DOCTYPE html>
<html>
<head>
<title>top</title>
</head>
<body>
新闻
</body>
</html>
浮动框架链接步骤：
a) 创建框架链接页面，这里命名为：浮动框架链接演示.html
代码如下：
<!DOCTYPE html>
<html>
<head> <title>浮动框架链接演示</title> </head>
<iframe src=”浮动框架.html” name=”fudong”></iframe>
<body><br/><br/>
<table>
<tr>
<td width=”100″><a href=”浮动框架1.html” target=”fudong”>浮动框架1</a></td>
<td width=”100″><a href=”浮动框架2.html” target=”fudong”>浮动框架2</a></td>
<td width=”100″><a href=”浮动框架3.html” target=”fudong”>浮动框架3</a></td>
</tr>
</table>
</body>
</html>
b) 创建浮动框架链接页面，这里命名为：浮动框架1.html
代码如下：
<!DOCTYPE html>
<html>
<head>
<title>浮动框架链接演示</title>
</head>
<body>
浮动框架1
</body>
</html>
随机文章
自爱沉稳而后爱人（亲密关系也要好好爱自己）小小课堂:CMS是什么意思？如何选择适合SEO的CMS系统？
传统营销已死
关键词排名算法公式
选择幸福
所有负债者的圣经
DNF土豪玩家回归，晒出一身稀有装备，声称不是十年老玩家认不全，这些装备你认识吗？
DNF游戏币大崩盘，比例即将回到1:55，究竟是何人所为？dnf要谅
发表评论