HTML的frame框架使用完整总结（web初学必看

HTML的frame框架使用完整总结（web初学必看）

一、前言

《大数据和人工智能交流》头条号向广大初学者新增C 、Java 、Python 、Scala、javascript 等目前流行的计算机、大数据编程语言，希望大家以后关注本头条号更多的内容。

由于很多web人员需要HTML的frameset和frame来构建窗体和子窗体页面，但是初学者苦于没有直接的资料总结，故给广大初学者完整的HTML的frame框架使用总结

二、HTML的frame框架使用

1、主页面index.htm

</frameset>

2、page文件夹的子页面

（1）left.htm

（2）right.htm

<center>这是数据区域</center>

（3）top.htm

<center>这是顶部页面</center>

（4）add.htm

<center>这是新增数据页面</center>

（5）delete.htm

<center>这是删除数据页面</center>

（6）query.htm

<center>这是查询页面</center>

（7）update.htm

<center>这是修改数据页面</center>

《大数据和人工智能交流》的宗旨

1、将大数据和人工智能的专业数学：概率数理统计、线性代数、决策论、优化论、博弈论等数学模型变得通俗易懂。

2、将大数据和人工智能的专业涉及到的数据结构和算法：分类、聚类、回归算法、概率等算法变得通俗易懂。

3、最新的高科技动态：数据采集方面的智能传感器技术；医疗大数据智能决策分析；物联网智慧城市等等。

根据初学者需要会有C语言、Java语言、Python语言、Scala函数式等目前主流计算机语言。

根据读者的需要有和人工智能相关的计算机科学与技术、电子技术、芯片技术等基础学科通俗易懂的文章。

lt;frameset></framset>框架组标记

<frame></frame>框架标记

语法格式：

</franeset>

<frameset></frameset>元素（双标签）

语法格式：

.......

</frameset>

属性：

cols 垂直切割窗口（如左右分割两个窗口）接受整数值，百分数，*（*代表占用余下空间）数值的个数代表分成的部分数目，要以逗号分隔。例：cols="30,*,50%"可以切成三个视窗，第一部分是30像素（pixels）为绝对分割，第二部分是当分配完第一和第三视图后剩下的空间，第三部分则占整个窗口的50%宽度，为相对分割。

rows 就是横向切割，将窗口上下分开，数值设置同上。

以上两属性尽量不要在同一个<frameset>标记中，因为netscape不支持，尽量采用多重分割。

frameborder 设置框架的边框，其值有0不要边框，1要边框。

border 设置框架边框厚度

framespacing 表示框架与框架间保留空白的距离

frame 元素（单标签）

语法格式：

属性：

name 框架名称，指定框架来做连接的目标窗口。

src 框架中要显示的网页文当url地址，每个个框架要对应一个html文挡。

scrolling 是否显示滚动条，yes/no,auto是自动。

noresize 设置不让使用者改变这个框架的大小，

noframe元素

指定当使用了框架的页面在不支持框架的浏览器中打开时显示的信息

语法格式：

......

</noframe>

架

框架技术可以实现对静态页面的互相引用，提高静态页面的重用性，因为并不是所有的浏览器都能很好的支持，而且对搜索引擎可能也不是很友好，所以一般网页使用并不多，但是对一些管理系统而言，框架还是很实用的，因为管理系统的布局比较简单。每一个页面的效果都差不多，一般使用下面这种布局。

这个布局头部，菜单和尾部的内容都是不会变化的，经常变化的就是中间的操作页面，所有可以把头部，菜单和尾部以及主页分别使用四个页面设计，然后在定义一个框架页面进行引入即可。

1、frame页面

top.html

<!doctype html>
<html>

<head>
<meta charset="UTF-8">
<title>Untitled Document</title>
</head>

leftmenu.html

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Untitled Document</title>
</head>

footer.html

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Untitled Document</title>
</head>

main.html

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Untitled Document</title>
</head>

2、总页面frame.html

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>frame</title>
<base href="<%=basePath%>">
</head>
<frameset rows="20%,65%,*" border="1">
<frame src="top.html">
<frameset cols="25%,*">
<frame src="leftmenu.html">
<frame src="main.html" >
</frameset>
<frame src="footer.html">
</frameset><noframes></noframes>
<body>
</body>
</html>

效果如下：

3、在main中加载新页面

运行上面代码发现超链接是在新的窗口中打开了，如果需要在主框架中显示，要先给这个主框架定义name的属性，然后在修改leftmenu.html的超链接的target属性值，写上主框架的name的值，下面更改frame.html中的frameset代码如下：

补充register.html代码如下：

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Untitled Document</title>
</head>

然后在frame.html中点击注册效果如下：

在线咨询

上一篇：PHP 文件上传：示例代码和心得
下一篇：荣耀阅读app 华为荣耀专属的阅读软件

您的项目需求

*请认真填写需求信息，我们会在24小时内与您取得联系。

整合营销服务商

HTML的frame框架使用完整总结（web初学必看

架

1、frame页面

2、总页面frame.html

3、在main中加载新页面

您的项目需求