1、1,HTML标准教程,第12章 使用框架结构,HTML标准教程,本章目标：,什么是框架 框架集标记 框架标记 不支持框架标记 浮动框架 框架与链接,HTML标准教程,12.1 什么是框架,1、作用： 就是把浏览器窗口划分为若干个区域，每个区域可以分别显示不同的网页。 2、目的：创建页面导航。,HTML标准教程,框架主要包括两部分，一个是框架集，另一个就是框架。 框架集：就是在一个文档内定义一组框架结构的HTML网页。框架集定义了在一个窗口中显示的框架数、框架的尺寸、载入到框架的网页等。 框架：就是指在网页上定义的一个显示区域。,12.2 框架集标记,HTML标准教程, 基本框架代码 ,页面代码
2、：,HTML标准教程,1、左右分割窗口 2、上下分割窗口 3、嵌套分割窗口,框架的分割方式,HTML标准教程,1、基本语法： 2、语法解释： value为定义各个框架的宽度值，单位可以是像素，也可以是百分比。 3、文件范例：12-1.htm,12.2.1 左右分割窗口属性COLS,HTML标准教程,1、基本语法： 2、语法解释： value为定义各个框架的高度值，单位可以是像素，也可以是百分比。 3、文件范例：12-2.htm,12.2.2 上下分割窗口属性ROWS,HTML标准教程,1、基本语法： ,12.2.3 嵌套分割窗口,HTML标准教程,2、语法解释： 上述代码先将框架按照行进行上下
3、分割，然后在第二个框架中进行按照列的左右分割。 3、文件范例：12-3.htm,12.2.3 嵌套分割窗口,HTML标准教程,1、基本语法： 2、语法解释： 设定框架集的边框宽度，单位为像素。 3、文件范例：12-4.htm,12.2.4 框架集边框宽度属性FrameSpacing,HTML标准教程,1、基本语法： 2、语法解释： 设定框架集的边框颜色。 3、文件范例：12-5.htm,12.2.5 框架集边框颜色属性BorderColor,HTML标准教程,总结：框架集属性,HTML标准教程,每一个框架都有一个显示的页面，这个页面文件称为框架页面。通过标记可以定义框架页面的内容。,12.3
4、框架标记,HTML标准教程,1、基本语法： 2、语法解释： 通过SRC属性设置框架显示的文件路径。 3、文件范例：12-6.htm,12.3.1 框架页面源文件属性SRC,HTML标准教程,1、基本语法： 2、语法解释： 设定框架页面的名称。 3、文件范例：12-7.htm,12.3.2 框架名称属性NAME,框架命名规则：必须是单个单词，允许使用下划线， 但不允许使用连字符，句号和空格。框架名称必须 以字母起始，而不能以数字起始。框架名称区分大 小写。不要使用JavaScript中的保留字作为框架 名称。,HTML标准教程,1、基本语法： 2、语法解释： value取值为0或1，0为不显示边
5、框，1为显示边框。 3、文件范例：12-8.htm,12.3.3 框架边框显示属性FrameBorder,HTML标准教程,1、基本语法： 2、语法解释： value取值见下表。 3、文件范例：12-9.htm,12.3.4 框架滚动条显示属性scrolling,HTML标准教程,框架滚动条显示属性值,HTML标准教程,1、基本语法： 2、语法解释： noresize代表禁止改变框架的尺寸大小。 3、文件范例：12-10.htm,12.3.5 框架尺寸调整属性noresize,HTML标准教程,1、基本语法： 2、语法解释： 设定框架的左右边缘宽度。 3、文件范例：12-11.htm,12.3
6、.6 框架边缘宽度属性MarginWidth,HTML标准教程,1、基本语法： 2、语法解释： 设定框架的上下边缘高度。 3、文件范例：12-12.htm,12.3.7 框架边缘高度属性MarginHeight,HTML标准教程,总结：框架属性,HTML标准教程,1、基本语法： ,12.4 不支持框架标记,HTML标准教程,2、语法解释： 放在标记之间的部分就是在不支持框架的浏览器中显示的内容，也就是标记中的内容。 3、文件范例：12-13.htm,12.4 不支持框架标记,HTML标准教程,1、基本语法： 2、语法解释： 属性的含义见下表。,12.5 浮动框架,浮动框架是一种特殊的框架页面，
7、在浏览器窗口中 可以嵌套子窗口，在其中显示页面的内容。,HTML标准教程,标记属性,HTML标准教程,1、基本语法： 2、语法解释： 通过src属性设置浮动框架显示的文件路径。 3、文件范例：12-14.htm,12.5.1 浮动框架的SRC属性,HTML标准教程,1、基本语法： 2、语法解释： 通过width和height属性设置浮动框架显示的宽度和高度。 3、文件范例：12-15.htm,12.5.2 浮动框架的width和height属性,HTML标准教程,1、基本语法： 2、语法解释： 设定浮动框架的名称，命名规则同框架的name属性。 3、文件范例：12-16.htm,12.5.3
8、浮动框架名称属性NAME,HTML标准教程,1、基本语法： 2、语法解释： value取值为0或1，0为不显示边框，1为显示边框。 3、文件范例：12-17.htm,12.5.4 浮动框架边框显示属性frameborder,HTML标准教程,1、基本语法： 2、语法解释： 设定浮动滚动条的显示，value取值见下表。 3、文件范例：12-18.htm,12.5.5 浮动框架滚动条显示属性scrolling,HTML标准教程,框架滚动条显示属性值,HTML标准教程,1、基本语法： 2、语法解释： 设定浮动的边缘宽度。 3、文件范例：12-19.htm,12.5.6 浮动框架边缘宽度属性MarginWidth,HTML标准教程,1、基本语法： 2、语法解释： 设定浮动的边缘高度。 3、文件范例：12-20.htm,12.5.7 浮动框架边缘高度属性MarginHeight,HTML标准教程,1、基本语法： 2、语法解释： value取值为left、center、right。 3、文件范例：12-21.htm,12.5.8 浮动框架对齐属性align,HTML标准教程,1、普通框架与链接 2、浮动框架与链接,12.6 框架与链接,文件范例:12-22.htm 12-23.htm,HTML标准教程,作业：,P304页 1、2、3,
