8.1 框架概述
框架是一种布局网页的方式，主要运用在一些论坛网站上，但是目前，网页的布局主要使用的方式是DIV+CSS
框架的作用是把浏览器窗口划分为若干个小窗口，每个小窗口可以分别显示不同的网页
框架的主要用途是导航，通常会在一个窗口中显示导航条，另外一个窗口则作为内容窗口，用于显示导肮栏目的目标页面内容，窗口的内容会根据导航栏目的不同而动态变化
框架页面的作用主要是分割窗口，在该页面中不涉及页面的具体内容，所以在该页面中不需要使用<body>标记
框架的基本结构主要分为框架集和框架两个部分
基本语法：
<frameset>
<frame/>
<frame/>
...
</frameset>
8.2 框架集标记
框架集标记<frameset>的作用主要是定义浏览器窗口的分割方式、各分割窗口**（框架）的大小**，以及设置框架边框的颜色和粗细等属性
| 属性 | 描述 |
|---|---|
| border | 设置边框粗细 |
| bordercolor | 7以RGB十六进制颜色值或颜色英文名设置框架边框颜色 |
| frameborder | 设置框架是否显示边框、可取值0或1，或者no或yes,默认显示边框 |
| framespacing | 设置框架之间的间距 |
| rows | 使窗口按行，即上下（垂直）的方式分割 |
| cols | 使窗口按列，即左右（水平）的方式分割 |
8.2.1 左右分割窗口
左右分割也叫水平分割，表示在水平方向将浏览器窗口分割成多个窗口，这种方式的分割需要使用<frameset>标记的cols属性
基本语法：
<frameset cols="value1,value2,...">
<frame>
<frame>
...
<frameset/>
语法说明：
cols属性值的个数决定了标记的个数，即分割窗口个数
各个值之间使用逗号分隔，各个值定义了相应框架窗口的宽度，可以是数字（单位是像素），也可以是百分比和“*”号表示的剩余值
8.2.2 上下分割窗口
上下分割也叫垂直分割，表示在垂直方向将浏览器窗口分割成多个窗口，这种方式的分割需要使用<frameset>标记的rows属性
基本语法：
<frameset rows="value1,value2,...">
<frame>
<frame>
...
</frameset>
语法说明：
rows属性值的个数决定了<frame>标记的个数，即分割的窗口个数。
rows定义的窗口高度，取值与cols属性的取值完全一样
8.2.3 嵌套分割窗口
浏览器窗口即存在左右分割，又存在上下分割，这种分割窗口的方式称为嵌套分割
这种方式的分割需要在<frameset>标记对内部嵌套<frameset>标记，并且子标记<frameset>和其直接父标记<frameset>的分割窗口方式不同
基本语法：
<frameset rows="value1,value2,...">
<frame/>
<frameset cols="value21,value22,...">
<frame/>
<frame/>
...
</frameset>
</frameset>
语法说明：
嵌套的<frameset>标记将会把父标记<frameset>分割的对应窗口再按自己所指定的分割方式进行第二次分割。嵌套的<frameset>标记替换了需二次分割的框架
8.2.4 使用标记设置框架边框
使用<framset>标记可以设置框架边框是否显示，以及对显示边框设置颜色和宽度
边框显示 =》 frameborder
边框颜色 =》 bordercolor
边框宽度 =》 border
框架间距 =》framespacing
基本语法：
<frameset frameborder="0|1|no|yes" framespacing="边框间距" border="边框宽度" bordercolor="颜色值">
语法说明：
默认情况下框架边框会显示边框，frameborder属性可取值0和1，或者no和yes，
其中0和no表示不显示边框，1和yes表示显示边框，默认值是1
在IE浏览器中，framespacing和border属性设置效果是一样的，都是对边框宽度的设置，任意使用一个就可以了
如果同时使用，framespacing的设置有效；
在Firefox浏览器中，边框宽度的设置使用border属性，framespacing属性无效
8.3 框架标记
<frameset>分割得到的每个子窗口都需要显示不同的页面内容，这些页面内容由<frame>标记来设置
<frame>是个单标记，它必须放在框架集frameset中，<frameset>分割了几个子窗口就必须对应几个<frmae>标记
| 属性 | 描述 |
|---|---|
| src | 设置在框架中显示的页面的URL地址 |
| bordercolor | 设置边框颜色 |
| frameborder | 指示边框是否要显示，取值1和0，或者no和yes,默认值是1 |
| border | 显示边框粗细 |
| name | 设置边框名称，可作为超链接的target的属性值 |
| noresize | 使用时表示不能调整窗口的大小，省略时表示可以调整 |
| scrolling | 设置窗口是否要显示滚动条，可取值yes,no和auto,默认是auto,表示根据需要自动出现，yes表示显示，no表示不显示 |
| marginwidth | 设置内容与框架窗口左右边框的距离 |
| marginheight | 设置内容与框架窗口上下边框的距离 |
8.3.1 设置框架显示内容
使用框架的主要目的是为了在一个浏览器窗口中同时显示不同页面的内容，指定要在框架中显示某个页面的内容需要使用<frame>的src属性
基本语法：
<frame src="需显示页面的URL">
语法说明：
src的属性值是需要在框架窗口中显示的页面的URL，该URL可以是绝对地址，也可以是相对地址
8.3.2 使用标记设置框架边框
超链接通过名称来引用框架
基本语法：
<frame frameborder="0|1|no|yes" bordercolor="颜色值">
8.3.3 使用框架名称
基本语法：
<frame name="框架名称">
8.3.4 设置框架窗口固定大小
默认情况下，用户可调节窗口的大小，有时为了保持界面的美观，我们通常会让框架的大小固定。通过框架的noresize属性可实现窗口大小固定
基本语法：
<frame noresize="noresize">
语法说明：
在HTML中，noresize属性值不需要设置，但在XHTML时，所有属性都必须有值，noresize属性的值就是它本身。
8.3.5 设置框架滚动条
默认情况下。框架的滚动条会自适应页面内容，即如果页面内容在一个窗口显示不了时，会自动在水平方向或垂直方向显示滚动条；反之则不显示。
滚动条的这种默认行为可以通过scrolling属性来修改
基本语法：
<frame scrolling="auto|no|yes">
语法说明：
scrolling属性可取auto、no、yes这3个值中的任一个，其中auto表示会根据页面内容自动显示滚动条，这是一种默认行为，此时可以省略scrolling属性的设置；
no表示永远不会显示滚动条，不管内容是否超出了一个窗口；
yes和no刚好相反，会一直显示滚动条，不管内容是否超出了一个窗口
8.3.6 设置框架边距
当页面没有设置边距时，页面内容与框架的上下边距默认是15像素，与框架左右边距默认是10像素
基本语法：
<frame marginheight="上、下边距" marginwidth="左、右边距">
语法说明：
marginheight和marginwidth属性分别用于设置页面内容与框架上、下边框以及左、右边框的间距，单位是像素
8.4 不支持框架标记
一些早期版本的浏览器不支持框架，使用框架时将会显示一个空白页面。
制作人员无法改变这一现象，所能做的只是告诉用户该浏览器不支持框架技术，有些页面无法看到，这一任务由<noframes>标记来完成
基本语法：
<noframes>
<body>
...
</body>
</noframes>
语法说明：
<body></body>标记对之间的内容就是用于显示给用户看的文本信息，
<noframes></noframes>放在<frameset></frameset>标记对后面
如下图：
8.5 浮动框架标记
浮动框架是一种特殊的框架页面，其作为HTML文档的一部分，就像图像一样出现在HTML文档中
浮动框架允许将一个HTML文档插入到另一个HTML文档内部的某个区域
其特殊性体现在：
（1）本身是一个框架，在其中能单独显示某个页面内容
（2）与其他一般框架不同，主要体现在这个框架是嵌套在一个HTML页面中，作为页面的一个组成部分
| 属性 | 描述 |
|---|---|
| src | 设置浮动框架中显示的页面的URL |
| width | 设置浮动框架的宽度 |
| height | 设置浮动框架的高度 |
| name | 设置浮动框架的名称，以便于其他对象引用它 |
| align | 设置浮动框架相对于浏览器窗口的对齐方式 |
| frameborder | 设置浮动框架边框显示与否，与普通框架相同 |
| scrolling | 设置浮动框架滚动条是否显示，与普通框架相同 |
| noresize | 设置浮动框架尺寸是否可调整，与普通框架相同 |
| bordercolor | 设置浮动框架边框颜色，与普通框架相同 |
| marginheight | 设置页面内容与浮动框架上、下边框的间距，与普通框架相同 |
| marginwidth | 设置页面内容与浮动框架左、右边框的间距，与普通框架相同 |
8.5.1 在页面中嵌入浮动框架
浮动框架就像HTML页面中其他对象一样，可以出现到页面中的任何一个位置，但与其他对象不同的是，浮动框架在页面中构建了一个区域，在这个区域中可以显示另一个HTML页面的内容，区域中显示的页面使用属性src来指定。
基本语法：
<iframe src="源文件地址">
语法说明：
源文件地址是指需要在浮动框架中显示的页面的地址，可以是绝对路径，也可以是相对路径
8.5.2 浮动框架的大小
浮动框架的默认宽度是200像素，高度是100像素
当默认的大小不能满足需求时，可以使用width和height属性来分别修改浮动框架的宽度和高度。
基本语法：
<iframe src="源文件地址" height="高度" width="宽度">
8.5.3 浮动框架的对齐方式
浮动框架就好比HTML页面中的一个图片，相对于周围对象的对齐方式有垂直方向和水平方向
基本语法：
<iframe src="源文件地址" align="对齐方式">
语法说明：
水平方向 =》 left 、 right
其中，left是默认值，
如果要使浮动框架在水平方向居中对齐，需要将浮动框架放到一个div标记对中，然后将div元素设置水平居中对齐（center）
垂直方向 =》 top、middle、bottom,其中bottom是默认值
8.6 框架与超链接
框架应用的一个重要目的是在一个浏览器窗口中同时存在一个导航栏窗口和对应的导航目标窗口，该目的通过超链接目标窗口的设置可以很容易实现
实现方法：将框架名作为超链接的target的属性值即可使用框架作为超链接的目标窗口
扫一扫
796
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
