理解网页框架与浮动框架技术-CSDN博客

本文链接：https://blog.csdn.net/gradonday/article/details/36905635

框架技术可以将浏览器窗口分隔成多个小窗口，并且在每个小窗口中，可以显示不同的网页，这样可以很方便地在浏览器中浏览不同的网页效果。

一、关于框架

框架的基本结构主要分为框架和框架集两个部分。它是用利用<frame>标记与<frameset>标记来定义的。其中，<frame>标记用于定义框架；<frameset>标记用于定义框架集。

常见的对窗口的分隔包括水平分割、垂直分割和嵌套分割。可用<frameset>标记中的row(水平分割)或的cols(垂直分割)属性进行分割。在完成窗口的分割后，要设置每个分割出来的子窗口。设置子窗口的属性都在相应的子窗口的<frame>标记中。其中，最重要的属性为子窗口的名称(name属性)和要导入到框架中的子窗口HTML文件的路径(src属性)。

×基本语法

……

</frameset>

×语法说明

(1)由<frameset>标记所定义的框架集，相当于<body>标记所定义的文件主题组件，因此<frameset>标记不可以包含在<body>标记中，否则框架集无法正常使用。可以直接将<frameset>标记包含在<html>标记中。<frame>主要用来控制所代表的窗口框架。

(2)rows属性可定义一个水平分割的窗口框架。其值代表各子窗口的高度，第一个子窗口的高度为高度1，第二个为高度2，依此类推，而最后一个子窗口的高度，值为其他子窗口高度分配后所剩余的高度。设置高度值的方式有两种，一种是采用数值设置，单位为像素(px)；一种是用百分比设置。

(3)cols属性可定义一个垂直分割的窗口框架。其值代表各子窗口的宽度，其使用方式同rows属性相同。

(4)border属性可控制分割窗口框架的边框。N为整数，代表此窗口框架的宽度，单位为像素(px)。

(5)frameborder属性用于控制窗口框架的周围是否显示框架，此属性可以使用在<frameset>标记与<frame>标记中，如果使用在<frameset>标记内时，可控制窗口框架的所有子窗口，如果用在<frame>标记中，则只能控制该标记所代表的子窗口。其属性值0表示不显示边框，1表示显示边框，默认值为1。

[补充]窗口的嵌套分割实例

</frameset>

二、子窗口的设置

1、指定子窗口显示网页

×基本语法

×语法说明

(1)src属性是用来指定要导入到某个子窗口的HTML文件的位置。src属性值指定要在该窗口内显示的网页的URL路径，该路径可以说相对路径，也可以是绝对路径。

(2)前面用<frameset>标记的rows和cols属性水平或垂直分割窗口后，各窗口框架的大小并非固定无法更改，当想要更改窗口框架大小时，可以用鼠标进行拖拽，来调整窗口的大小。当不希望用户随意改变子窗口大小时，可以在<frame>标记中，添加noresize属性。

(3)name属性用来指定窗口的名称，当完成子窗口的名称定义后，可指定超链接的链接目标显示到网页的某个子窗口。在JavaScript程序中可以通过名字来获得对应的子窗口。

(4)scrolling属性用于控制窗口框架中是否显示滚动条。其属性值yes表示为显示滚动条，no表示不显示滚动条，auto为自动设置。

(5)在HTML文件中，可以用框架<frame>标记中的marginwidth和marginheight属性设置相应子框架的左右和上下边缘的空白。Marginwidth属性设置框架左右边缘的宽度，marginheight设置框架上下边缘的宽度。

三、浮动框架

在浏览网页的时候会看到在浏览窗口中有孤立的子窗口，浏览的是其他网页的内容，那么这就是浮动框架。插入浮动框架要使用成对标记<iframe></iframe>。

×基本语法

×语法说明

与框架不同的是，浮动框架可以包含在<body>标记中，是当前窗口包含的内部对象。浮动框架所包含的属性如下表所示：

属性	说明
src	设置源文件URL路径
width	设置浮动窗口框架窗口宽度
height	设置浮动窗口框架窗口高度
name	设置框架的名称
align	设置框架对齐方式
frameborder	设置是否有框架边框，1或者0
framespancing	设置框架边框宽度
scrolling	设置框架滚动条
noresize	设置框架尺寸是否可调整
bordercolor	设置边框颜色
marginwidth	设置框架左右边距
marginheight	设置框架上下边距

框架frame