第7章 使用框架创建多页面布局.ppt

1、第7章 使用框架创建多页面布局,主要内容,建立水平或垂直的框架分割窗口,用嵌套框架分割窗口,对滚动条进行控制,在空白窗口显示网页,在框架或浮动框架上进行链接,用嵌套框架分割窗口,7.1 框架简介,7.1.1 框架 框架技术可以将浏览器分割成多个窗口，在各个窗口中，显示不同的网页，可以方便地在浏览器中浏览不同效果的网页。 各窗口承担不同的角色，实现不同的功能。 7.1.2 框架的基本结构 框架的基本结构主要分为框架和框架集两个部分。 标记用于定义框架。 标记则用于定义框架集。,7.1.2 框架的基本结构, . . ,、用于定义框架集，书写在与 之间，注意不可添加在与之间。 、用于描述具体的框架属

2、性。 规范的XHTML需要书写结束标记。,7.2 利用框架分割窗口,常见的窗口分割方式： 水平分割 垂直分割 组合（嵌套）分割,7.2.1 窗口的水平分割,“rows”属性可定义一个水平分割的窗口框架。 语法结构： 语法说明 rows 属性的值代表各子窗口的高度，第一子窗口高为“高度1”，第二子窗口高为“高度2”，“*”则代表值为其他窗口高度分配后剩余的高度。 高度数值设置： 1、采用整数设置，单位为像素（px），如： 2、用百分比设置，如：,7.2.1 窗口的水平分割,语法结构： 语法说明 name 属性的值代表各子窗口的别名，用于设定超链接目标的显示位置。 src 属性的值是url地址，用

3、于指定该窗口中要显示的具体网页文件。,7.2.1 窗口的水平分割, 框架的水平分割 ,7.2.2 窗口的垂直分割,“cols”属性可定义一个垂直分割的窗口框架。 语法结构： 语法说明 cols 属性的值代表各子窗口的宽度。,7.2.2 窗口的垂直分割, 框架的水平分割 ,7.2.3 窗口的嵌套分割,在实际应用中，框架往往是水平、垂直分割的相互组合，需要对窗口进行嵌套分割。,7.2.3 窗口的嵌套分割, 嵌套分割 ,7.3 框架窗口的设置,边框的边线宽度； 边框的边线隐藏； 框架窗口的滚动条； 框架窗口的尺寸调整； 网页内容与框架边框的边距。,7.3 框架窗口的设置,7.3.1 边框的边线宽度

4、在标记中，可运用border属性控制分割窗口框架的边框。 基本语法： 语法说明： n为整数，代表此窗口框架的宽度， 单位为像素(px)。,7.3 框架窗口的设置,7.3.2 边框的边线隐藏 frameborder属性用于控制窗口框架的周围是否显示框架，可使用在标记与标记中。 使用在标记内时，可控制所有子窗口，使用在标记中，只控制该标记所代表的子窗口。 基本语法： 语法说明： 0表示不显示边框，1（默认值）表示显示边框。,7.3 框架窗口的设置,7.3.3 框架窗口的滚动条 scrolling属性用于控制窗口框架中是否显示滚动条，使用此属性，可以避免HTML文件因内容过多而无法完全显示。此属性用

5、于标记中。 基本语法： 语法说明： yes表示为显示滚动条 no表示不显示滚动条 auto为自动设置,7.3 框架窗口的设置,7.3.4 框架窗口的尺寸调整 将鼠标指针移到要更改的框架上，待指针呈现双箭头符号时，再用鼠标进行拖拽，可框架调整窗口的大小。 当不希望用户能随意地改变子窗口的大小时，可以在标记中，添加noresize属性， 基本语法： ,7.3 框架窗口的设置,7.3.5 网页内容与框架边框的间距 利用标记中的marginwidth属性来设置框架左右边缘的宽度；marginheight属性可以设置框架上下边缘的宽度。 基本语法： ,7.4 浮动（嵌入式）框架,不对窗口做整体分割，根据

6、需要在网页中嵌入的子窗口，称为“浮动（嵌入式）框架”。 插入浮动框架要使用成对的标记。 基本语法： 语法说明： 浮动框架可以包含在标记中。 详细属性见教材表7-1。,7.4 浮动（嵌入式）框架,Name= 给框架命名 Src= 当前框架所链接的页面地址 Frameborder= 边框是否显示，“1”显示边框（默认值为），“0”不显示 Marginwidth= 框架边框与内容左右间距 Marginheight= 框架边框与内容左右间距 Scrolling= 滚动条，有3个值：auto自动，yes 总是显示，no 不显示 align= 对齐方式 (可设置6个方向位置) width= 宽度设置（水平方向） height= 高度设置（垂直方向） Noresize 浮动框架大小不可变,小结,本章主要介绍了两种框架方式：一种是分割窗口式，一种是嵌入式，两种框架的