《快速精通掌握frame的使用》由会员分享，可在线阅读，更多相关《快速精通掌握frame的使用（8页珍藏版）》请在金锄头文库上搜索。
1、FRAME（框架）是 Web 上经常会看到的页面结构。使用可视 Web 开发工具（比如 Dreamweaver 或者Frontpage），虽然可以在 WYSIWYG 环境中通过简单的鼠标托拽完成 FRAME 的构建，但是要实现真正细致甚至强大的功能，仔细理解 FRAME 的代码结构至关重要！你将发现，FRAME 原来是这样的亲切易用。创建基本的 FRAMESET FRAMESET 页面与普遍的 Web 页面有些不同。虽然仍旧以HTML和包含标题的HEAD标记以及其他脚本开始，但是其内容仅仅是表示的各个页面的版式设计。因此，不再需要有BODY元素，只需要FRAMESET标记。 通过FRAMESE
2、T标记的rows和cols属性，浏览器窗口被分割为一个个格子。rows和cols的设置值可以是固定的像素值，可以是总空间的百分比值，还可以是用*以及一个数字相乘表示的分割剩余空间的比例值。比如说： cols=”80,20%,*” 分为 3 列，宽度分别为 80 像素，窗口宽度的 20，以及剩余宽度 rows=”25%,75%” 分为 2 列，宽度分别为窗口宽度的 25和 75 rows=”*,3*” 与上述第 2 个表示的一样，分为 2 列，但表示方法不同：第一列宽度为第二列的 1/3 在FRAMESET和/FRAMESET之间，用多个FRAME标记表示每个分割区。col 表示从左到右的列，r
3、ow 表示从上到下的行。每个FRAME有一个 src 属性，给出了这个 FRAME 的内容。它可以是浏览器能显示的任何一个合法 URL，或者是另外一个 FRAMESET。为预防递归现象，一个 FRAME 不能包含它本身所在的 FRAMESET 页面。要用 name 属性定义 FRAME 的名字，这样就可以在代码或者脚本程序中引用它。 请看一段基本的 FRAMESET 代码：HTMLHEADTITLESimple FRAMESET/TITLE/HEADFRAMESET cols=”40%,60%” rows=”2*,*”FRAME name=”TopLeft” src=”red.htm”FRAM
4、E name=”TopRight” src=”green.htm”FRAME name=”BotLeft” src=”blue.htm”FRAME name=”BotRight” src=”white.htm”/FRAMESET/HTMLFRAMESET rows=”105,*”FRAME name=”adbanner” src=”ad.html”FRAMESET cols=”40%,60%”FRAME name=”left” src=”red.htm”FRAMESET rows=”*,*”FRAME name=”top” src=”blue.htm”FRAME name=”bottom” s
5、rc=”white.htm”/FRAMESET/FRAMESET/FRAMESETFRAME 间的链接 一个 FRAMESET 结构的页面，新文档只转载进窗口的一部分中，而其他页面则保持静态不变。当用户点击 FRAME 中的链接时，新内容就在同一 FRAME 内打开。要让新内容在其他 FRAME 中打开，可以设置A标记的 target 属性值为那个 FRAME 的 name 值。 而且，我们还可以设置打开目标为当前可见的任意一个 FRAME，而不局限于本身的 FRAMESET。目标可能是一个嵌套的 FRAMESET 中的 FRAME，也可能是其他窗口中的 FRAME。但是如果目标 FRAME
6、不存在，就会产生一个带有目标 FRAME 名字的新窗口。 下面举个例子说明一下，假设有一个简单含 2FRAME 的 FRAMESET，文件名叫做 home.html，代码如下： HTMLHEADTITLEFrommCo home page/TITLE/HEADFRAMESET cols=”115,*”FRAME src=”menu.htm”FRAME name=”content” src=”main.htm”/FRAMESET/HTML 文件 menu.htm 在左边的 FRAME 中，其中有一系列链接，点击它们后新内容将在右边的叫做 content的 FRAME 中打开。下面是 menu.h
7、tml 的代码： HTMLHEAD/HEADBODYPBRIMG src=”Images/tmp_logo.gif” alt=”FrommCo”PA href=”main.htm” target=”content”Main page/APA href=”mission.htm” target=”content”Our mission/APA href=”staff.htm” target=”content”Our staff/APA href=”splash.htm” target=”_parent”FrommCo splash page/A/BODY/HTML 请注意最后一个链接中 targ
8、et 的定义为_parent，这属于 4 个特殊的保留值。它们是： _parent：在当前 FRAMESET 位置显示新 href。 _top：在当前整个窗口位置显示新 href，比如本身 FRAMESET 位于另一个 FRAMESET 中。 _self：强制在当前 FRAME 中显示新 href。 _blank：在新窗口中显示 href。表示客户端图形地图的AREA标记同样可以应用 target 属性，比如：AREA shape=circle coords=”75,75,50 href=”main.htm” target=”content” alt=”Main page” 还有一种经常的情况
9、是：Web 页面中的大部分或者全部链接都要求在一个特别的 FRAME 中打开。这时，可以在页面的HEAD代码区使用BASE标记设置默认的 target，然后再分别定义特殊链接的 target值。修饰 FRAMEFRAMESET 不仅在宽度、高度等方面具有可控制的数值，在美观方面也同样可以精确设置。 默认情况下，FRAMESET 的 FRAME 间有一个凸起的边沿，表示分割效果。如果不喜欢这个，想营造“无缝连接”的效果，可以在FRAME标记中设置 FRAMEborder=0 来消除它。在 3.0 及高版本的Navigator 和 Internet Explorer 中，如果在FRAMESET标记
10、中设置 FRAMEborder=0，那么除了设置为FRAMEborder=1 的 FRAME 外，所有其他 FRAME 的边沿都将消失。 虽然设置了 FRAMEborder=0，有些浏览器仍旧会在 FRAME 间保留一些边沿的颜色痕迹。这时，可以在FRAMESET标记中添加 FRAMEspacing=0（对 Internet Explorer）或者 border=0（对 Navigator 和Opera）实现真正的无缝连接。 请看下面的代码是如何使用这些属性的：HTMLHEADTITLEFrommCo home page/TITLE/HEADFRAMESET cols=”115,*” FRAM
11、Espacing=0 border=0FRAME src=”menu.htm” FRAMEborder=0 noresize scrolling=noFRAME name=”content” src=”main.htm” FRAMEborder=0/FRAMESET/HTML 上面的代码中有 2 个新的属性：noresize 表示锁住 FRAME 而不允许使用鼠标改变大小，scrolling=no 表示屏蔽 FRAME 的滚动条，scrolling=yes 表示允许，scrolling=auto 表示根据显示内容需要自动显示滚动条。浮动 FRAME 浮动 FRAME 是 HTML4.0 规范中
12、的一个定义，目前的浏览器都支持它。 不象 FRAMESET 表示的分割区样子，一个浮动 FRAME 作为一个内置对象存在于 Web 页面上，其样式就象一个页面上的一个图形或者一个 applet。浮动 FRAME 使用IFRAME标记，它具有与FRAME相同的大多数属性设置，包括：name、src、marginwidth、marginheight、FRAMEborder 以及 scrolling。同时，它还具有与图形或者 applet 一样的 height、width 和 align 属性。 而且，浮动 FRAME 遵循与普通 FRAME 一样的 target 原则：我们可以通过它的 name
13、来指向它。本原则适用于在任一类型 FRAME 中的浮动 FRAME，反之易然。浮动 FRAME 中的没有 traget 的链接指向它本身，而_parent 链接则指向包含IFRAME的文档所在的 FRAME 或者窗口。比如：IFRAME name=”floater” src=”start.htm” width=150 height=200 hspace=10 align=leftIMG src=”Images/noFRAME.gif” alt=”You cant see the floating FRAME”width=150 height=200 hspace=10 align=right/
14、IFRAMEBRA href=”one.htm” target=”floater”Show one.htm/APA href=”two.htm” target=”floater”Show two.htm/APA href=”start.htm” target=”floater”Bring back start.htm/A注意，对应支持IFRAME标记的浏览器，任何位于IFRAME和/IFRAME间的内容都将忽略。反之，其中的内容将显示出来，这可以用作解释当前浏览器不支持IFRAME。何时使用 FRAME 我们知道，FRAMESET 的基本用途就是分割浏览器窗口，使得窗口的一部分内容改变，而其他
15、部分保持不变。利用这个特性，就可以实现工具栏导航功能，一个 FRAME 内放置静态菜单页面，用户点击其中的项目后，在另外的 FRAME 内显示相关的内容。这样就可以从整体上减少文件大小，因为不必在每个内容页面中再包含菜单项目。 FRAME 有 2 个明显的不足：FRAME 从另外的级别上增加了站点的管理，原因在于超级链接不仅仅要指向适当的页面，而且也会装载到相关的 FRAME 内。 另外，大多数浏览器在执行“添加书签”的操作时，只能记录下 FRAMESET 的初始位置。不管添加书签时是位于多么深的 FRAMESET 中，当再次选择这个书签时，就会返回到 FRAMESET 的初始页面。这就加大了访问者浏览指定内容的难度。 但是，如果好好地组织站点信息，使导航操作只有不深的几层，那么，使用 FRAME 就能很好地为访问者服务。记住：访问者都希望简洁的导航信息。 当然，导航并非是使用 FRAME 的唯一原因，也可以使用 FRAME 创建交换工具和交换页面。而且，FRAME 的多文档框架结构非常适于被 javascript 应用程序所操作。用 FRAME 设计站点 最常用的 FRAME 结构就是“菜单内容”FRAMESET。一个 FRAME 内放置导航菜单，另一个 FRAME 内转载子菜单，每个子菜单的链接就指向本身。唯一的有 target 的链接
