frameset 标签属性参考和简单实例应用

来源：互联网发布：3ds淘宝哪家编辑：程序博客网时间：2024/06/14 12:57

frameset 标签，代替body标签定义了框架页,并且定义了框架将分为多少行与多少列

frameset 标签常用属性
- cols – 定义了框架含有多少列与列的大小(每个值使用逗号分隔)，取值为象素px或者百分比%
- rows – 定义了框架含有多少行与行的大小(每个值使用逗号分隔)，取值为象素px或者百分比%
- border – 定义frame定义的框架页的边框(单位像素)，使用css实现
- frameborder – 定义框架页是否边框(此属性应写在frame标签内部,不应在此出现)
- framespacing – 定义框架页之间间隔的距离,使用css实现
<noframes>标签

可为那些不支持框架的浏览器显示文本，和组合使用可以做为浏览器不支持iframe标签时显示
<iframe>标签

创建一个包含另外一个文档的内联框架，iframe标签内的内容。
<frame>标签

定义frameset标签中每个框架页的内容frame标签是单独出现的，<frame />

常用属性:

frameborder – 定义了内容页的边框,取值为(1|0),缺省值为1。
- 1 – 在每个页面之间都显示边框
- 0 – 不显示边框
name – 在一个框架页链接到另一框架页时使用(另一个框架页可以使用target定义链接页)
noresize – 定义了浏览者是否可以通过拖拽改变框架页尺寸,取值为(noresize)
scrolling – 定义是否有滚动条,取值为(yes|no|auto),缺省值为auto
yes – 显示滚动条
no – 不显示滚动条
auto – 当需要时再显示滚动条
src – 定义了内容页URL
border – 设置边框粗细

学生管理系统简单实例

这里写图片描述

代码示例

<!doctype html><html lang="zh"><head>    <meta charset="UTF-8">    <title>学生管理系统</title></head>    <frameset rows="100,*" border="2">        <frame src="top.html" name="top" />        <frameset cols="200,*" border="2">            <frame src="menu.html" name="menu" />            <frame src="main.html" name="main"/>        </frameset>    </frameset></html>

【top.html】

<!doctype html><html lang="en"><head>    <meta charset="UTF-8">    <title>top</title></head><body>    <center><h1>学生管理系统</h1></center></body></html>

【menu.html】

<!doctype html><html lang="en"><head>    <meta charset="UTF-8">    <title>menu</title>    <style type="text/css">        a:visited{color:red;}    </style></head><body><a href="#">目录</a><br><br><a href="main.html" target="main">用户登录</a><br><br><a href="#">浏览用户</a></body></html>

【main.html】

<!doctype html><html lang="en"><head>    <meta charset="UTF-8">    <title>用户登录界面</title></head><body background="./res/bg03.jpg">    <table background="./res/bg.gif" width="522" height="222" align="center">        <caption>            <h3>用户登录界面</h3>        </caption>        <tr>            <td align="center">                <form action="a.php">                    密码：<input type="text" name="username"/><br /><br />                    帐号：<input type="password" name="pwd"/><br /><br />                    <input type="submit" value="登 录" />                    <input type="reset" value="重 写" />                </form>            </td>        </tr>    </table></body></html>

阅读全文

0 0