第7篇使用框架创建多页面布局.pptVIP

第7章 使用框架创建多页面布局 主要内容 7.1框架简介 框架技术可以将浏览器分割成多个小窗口，并且在每个小窗口中，可以显示不同的网页，这样我们就可以很方便的在浏览器中浏览不同的网页效果。 当浏览器分割成多个窗口后，各窗口就会扮演不同的角色，实现不同的功能。举例来说，有些论坛就是把浏览器分割成两个窗口，一个窗口主要来显示帖子的标题，而另一个窗口会显示具体的内容。这样的设计显然比起一个窗口的网页在浏览时方便得多，而且用户也可以任意的切换题目。。 框架的基本结构 框架的基本结构主要分为框架和框架集两个部分。它是利用frame标记与frameset标记来定义。其中frame标记用于定义框架，而frameset标记则用于定义框架集。 框架的基本结构 html head title框架的基本结构/title /head frameset … frame … /frame … /frameset /html 7.2框架的设置 常见的对窗口的分割包括：水平分割、垂直分割和嵌套分割。具体采用哪种分割方式，取决于实际需要，可用frameset标记中的rows（水平分割）或cols（垂直分割）属性来进行分割。 窗口的水平分割 rows属性可定义一个水平分割的窗口框架。 窗口的水平分割 语法说明 rows属性的值代表各子窗口的高度，第一个子窗口高为高度1，第二个子窗口高为高度2，依此类推，而最后一个*，则代表最后一个子窗口的高度，值为其他子窗口高度分配后所剩余的高度。 设置高度数值的方式有两种： 采用整数设置，单位为像素（px），语法如下： frameset rows=100，200，* 用百分比设置，语法如下： frameset rows=20％，50％，* !--程序7-1-- html head title采用整数设置窗口的水平分割/title /head frameset rows=80,120,* frame frame frame /frameset /html 窗口的垂直分割 cols属性可定义一个垂直分割的窗口框架。 基本语法： 一个垂直分割的例子 窗口的嵌套分割 在实际应用中，“厂”字型框架使用极为广泛。“厂”字型的网页就是窗口中包含水平和垂直分割，如图所示，实现“厂”字型框架需要对窗口进行嵌套分割。 窗口的嵌套分割 框架的边框 在frameset标记中，可运用border属性控制分割窗口框架的边框。 基本语法： frameset border=n 语法说明： n为整数，代表此窗口框架的宽度，单位为像素(px)。 框架的边框 框架的边框 框架的隐藏 frameborder属性用于控制窗口框架的周围是否显示框架，此属性可使用在frameset标记与frame标记中，如果使用在frameset标记内时，可控制窗口框架的所有子窗口，如果用在frame标记中，则只能控制该标记所代表的子窗口。 基本语法： frameset frameborder=0或1语法说明： 0表示不显示边框，1表示显示边框，默认值为1。 7.3子窗口的设置 指定子窗口显示网页 定义子窗口名称 控制子窗口滚动条 调整子窗口的尺寸 设置子窗口的边距 指定子窗口显示网页 src属性是用来指定要导入到某个子窗口的HTML文件的位置，语法如下： 基本语法： frame src=html文件的位置 语法说明： src属性的设置方法和前面介绍的img标记的src属性的用法是一样的，下面的frame标记，将设置子窗口显示名称为frame.html的网页。 frame src=frame.html。 指定子窗口显示网页 指定子窗口显示网页 定义子窗口名称 name属性用来指定窗口的名称，当完成子窗口的名称定义后，可指定超链接的链接目标显示到网页的某个子窗口。 基本语法： frame name=子窗口名称 控制子窗口滚动条 scrolling属性用于控制窗口框架中是否显示滚动条，使用此属性，可以避免HTML文件因内容过多而无法完全显示。此属性用于frame标记中。 基本语法： frame scrolling=yes或no或auto 语法说明： yes表示为显示滚动条，no表示不显示滚动条，auto为自动设置。 !--程序7-8-- html head title控制框架滚动条/title /head frameset rows=20%,70%,* frame scrolling=yes frame scrolling=no frame scrolling=auto /frameset /html 调整子窗口的尺寸 设置子窗口的边距 网页的边距可以通过“margin”来设定，那么框架和网页一样也可设置边距，可以利