第11章框架
框架主要用于在一个浏览器窗口中显示多个H T M L文档。通过构建这些文档之间的相互关系，从而实现文档导航、文档浏览以及文档操作等目的。框架是I n t e r n e t网页中最常使用的页面设计方式，具不完全统计，大约有8 0％以上的主页都采用了框架技术。
本章将介绍如何在D r e a m w e a v e r中实现框架。
11.1  框架概述
在浏览网页时，我们肯定遇到过这样的情形：在浏览器窗口中被分隔成了几个不同的区域，每个区域中显示不同的文档内容。最常见的方式是将左方或上方的区域设置为目录区域，其中显示文档页面的目录索引或导航条，而将右方或下方的区域设置为主体区域，其中显示网页主体内容。通过单击不同
的目录索引项或导航条按钮，就可以在主体区域实现网页之间的导航，在浏览网页的同时，目录索引或导航条始终显示于页面的目录区域中，这样便于用户继续浏览其他的网页。
在上述的情形中实际上就是应用了框架（F r a m e s）技术。利用框架技术，可以将不同的文档显示在同一个浏览器窗口中。通过构建这些显示在同一窗口中的文档之间的相互链接关系，可以实现文档之间的相互控制。
实际上，我们不必连入I n t e r n e t，也可以看到框架效果，启动D r e a m w e a v e r的帮助系统，
框架1
用html设计一个疫情网页代码
框架2
框架3
图11-1  使用了框架技术的Dreamweaver帮助系统
您就可以看到带有三个框架区域的浏览器窗口，如图11 -1所示。
本节将介绍一些框架技术的基本概念，以便于读者更好地了解如何在D r e a m w e a v e r 中设计框架。
11.1.1  框架和框架集
一般来说，框架（  F r a m e s ）技术主要通过两种类型的元素来实现，一个是框架集（F r a m e s e t ），另一个是框架（F r a m e ）。请注意这每个术语对应的英文单词，其中第一个“框架”是复数形式的单词F r a m e s ，而后一个“框架”对应的单词是单数形式的单词F r a m e 。在中文中我们很难区分它们，但前者表示技术，后者表示具体的元素，它们确实是概念不同的东西，所以有时候，我们又将前者的“框架”（F r a m e s ）称作“框架技术”，而将后者的“框架”（F r a m e ）称作“框架文档”。
所谓框架集，顾名思义，就是框架的集合。框架集实际上是一个页面，用于定义在一个文档窗口中显示多个文档的框架结构。例如，它可以决定文档窗口中显示的文档数目、每个文档的大小，以及文档被载入框架集窗口中的方式等。一般来说，框架集文档中的内容不会显示在浏览器中。所以有时候，我们可以将框架集仅仅看成是一个可以容纳和组织多个文档的容器。
所谓框架，就是在框架集中被组织和显示的文档。在框架集中显示的每个框架事实上都是一个独立存在的H T M L 文档。
图11 -2显示了框架和框架集之间的关系。在图中，1个框架集中包含了3个框架文档。它很形象地显示了图11 -1中的框架结构关系。在图11 -1中，框架集是C o n t e x t H e l p .h t m 文档，框架1是n a v i g a t i o n .h t m 文档；框架2是c o n t 11 .h t m 文档；框架3是1 0f r a m e s 1.h t m l 文档。您可以分别在相应的区域，单击鼠标右键，然后选择“查看源文件”命令来查看每个框架文档的源文件；打开浏览器的“编辑”菜单，选择“查看源文件”命令，可以查看框架集文档本身的源文件。
图11-2  框架和框架集
框架技术经常用于实现文档的导航。其作用有些像Wi n d o w s 的资源管理器，一个窗格显示站点中的的文件结构，另一个窗格显示站点中文档的具体内容。利用框架技术将两个或多
框架
框架集框架
框架
个网页联系起来，使得在一个网页中的操作，会对另一个网页中发生影响。
11.1.2  用HTML实现框架技术
框架技术最早是由N e t s c a p e公司提出的，并在Netscape Navigator浏览器中最早得以实现，最初出现的时候，很多人对之提出了批评，认为它搞乱了文档之间的关系，使对文档的控制变得难于理解。
然而随着它在I n t e r n e t上使用的普及，其巨大的优势也逐渐显露出来，终于被W 3C组织接纳，最终被写入H T M L规范。目前绝大多数浏览器，包括微软的Internet Explorer，都提供了对它的完美支持。
在H T M L代码中，实现框架技术非常简单，它主要通过三个标记：< f r a m e s e t>标记、< f r a m e>标记和< n o f r a m e s>标记来实现。
1. <frameset>和< /f r a m e s e t>标记
采用框架技术的网页和普通的网页，在代码结构上有稍许差别。普通的网页将文档的主体内容放置于< b o d y>和< /b o d y>标记间，而在采用框架技术的网页中，则用< f r a m e s e t>和< /f r a m e s e t>标记替代了< b o d y>和< /b o d y>标记。
< f r a m e s e t>和< /f r a m e s e t>标记决定了在文档中如何对框架文档进行布局，换句话说，它决定如何对浏览器窗口进行分区，以及在每个分区中显示什么文档的内容。
大多数情况下，在其中还包含< n o f r a m e s>和< /n o f r a m e s>标记，以放置当浏览器不支持框架时显示的内容。
下面显示了一个使用框架技术的网页代码，它将浏览器窗口分割为左右两个等宽的窗格，左边窗格中显示名为l e f t.h t m l的文档，而右边窗格显示名为r i g h t.h t m l的文档：< h t m l>
< h e a d>
< t i t l e>框架技术示例< /t i t l e>
< /h e a d>
<frameset cols="50%, 50%">
<frame src="left.html">
<frame src="right.html">
< /f r a m e s e t>
< /h t m l>
< f r a m e s e t>标记带有很多属性，除了通用的属性之外，在控制框架集结构方面，  c o l s属性和r o w s属性最为重要，我们将之介绍如下：
cols = MultiLengths    c o l s属性用于定义在框架集中每个框架的宽度，其中M u l t i L e n g t h s 用于描述多个框架的宽度列表。每个框架宽度之间以逗号分隔。
框架的宽度可以是像素值，可以是相对于整个框架集文档宽度的百分比，也可以使用相对宽度来定义。如果要用像素值定义框架宽度，可以直接用数值来表示，例如，“2 0”表示宽度是2 0像素；如果要用百分比定义框架宽度，则可以用数字后带有百分比符号的形式来表示，例如，“2 0%”表示该框架的宽度是整个框架集宽度的2 0%；如果要用相对宽度定义框架宽度，则可以用整数后加星号（*）的形式来表示，例如，“cols = "2*, 5*"”表示左方框架宽度同右方框架宽度的比例为2 :5。
在下面的代码中，定义了一个在水平方向上包含3个框架的框架集文档，其中，左方的框
架宽度为4 0像素，右方的框架宽度为整个框架集宽度的3 0％，而中间的框架宽度则是剩余的宽度：
<frameset cols = "40, *, 30%">
rows = MultiLengths r o w s属性用于定义在框架集中每个框架的高度，其中M u l t i L e n g t h s 是用于描述多个框架的高度列表。每个框架高度之间以逗号分隔。
与c o l s属性类似，框架的高度可以是像素值，可以是相对于整个框架集文档高度的百分比，也可以使用相对高度来定义。
在下面的代码中，定义了一个在垂直方向上包含3个框架的框架集文档，其中，上方的框架高度为4 0像素，下方的框架高度为整个框架集宽度的3 0％，而中间的框架高度则是剩余的宽度：
<frameset rows = "40, *, 30%">
frameborder = bool    f r a m e b o r d e r属性用于确定在框架集中是否显示框架边框。实际上，它设置的就是是否显示框架和框架之间分隔条。
如果属性值为1或Ye s，表明该框架集中所有的框架都显示边框。
如果属性值为0或N o，表明该框架集中所有的框架都不显示边框。
bordercolor = color该属性设置框架集中所有框架边框的颜值，其中c o l o r是颜的十六进制数值。
border = length该属性用于设置框架集中各框架边框的宽度，其中l e n g t h是宽度值，其单位是像素。
framespacing = length该属性用于设置框架集中各框架之间的间隔，其中l e n g t h是距离值，其单位是像素。
2. <frame>和< /f r a m e>标记
< f r a m e s e t>和< /f r a m e s e t>标记决定了在文档中如何对框架文档进行布局，而< f r a m e>和< /f r a m e>标记则具体定义了框架集文档中的每个框架。每个< f r a m e>和< /f r a m e>标记对应于一个框架，它们必须出现在< f r a m e s e t>和< /f r a m e s e t>标记之间。
< f r a m e>带有很多非常重要的属性，我们将之介绍如下：
name = cdata在使用框架技术的网页中，< f r a m e s e t>标记的n a m e属性特别重要，它用于为每个框架文档设置名称。在利用链接在框架集文档窗口的窗格中打开框架文档时，通过将n a m e属性和链接的t a r g e t属性相结合，可以指定在哪个窗格中打开文档。
src = url s r c属性用于指定框架文档的来源，其中u r l是框架文档的U R L地址。一般来说，框架文档是一个H T M L文档，它以文件的形式，单独存储于磁盘上，从文件的角度上来看，框架文档和框架集文档是分属不同文件的。
frameborder = bool    f r a m e b o r d e r属性用于确定在框架集中是否显示框架边框。实际上，它设置的就是是否显示框架和框架之间分隔条。
如果属性值为1或Ye s，表明该框架与其四周的框架相邻处显示分隔条。
如果属性值为0或N o，表明该框架与其四周的框架相邻处不显示分隔条。
该属性设置会覆盖< f r a m e s e t>标记中f r a m e b o r d e r属性的设置。
marginwidth = pixels该属性用于定义框架左右两边的空白间距，也即框架中内容同框架左右边框的距离。其中p i x e l s是空白间距的像素值。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。