《框架网页与CSS样式表0501》由会员分享，可在线阅读，更多相关《框架网页与CSS样式表0501（24页珍藏版）》请在金锄头文库上搜索。
1、第第5章章 框架网页与框架网页与CSS样式表样式表 5.1 框架网页框架网页 5.2 CSS样式表样式表 框架网页和样式表是网页布局技术的另一个部分。使用框架网页和样式表是网页布局技术的另一个部分。使用框架网页能更好地组织页面，而样式表能使网页更具个性，框架网页能更好地组织页面，而样式表能使网页更具个性，并能提高网页制作的效率。并能提高网页制作的效率。 5.1 5.1 框架网页框架网页 任务：任务：u说出框架网页与框架页面的区别与联系。说出框架网页与框架页面的区别与联系。u建立框架网页，并为各个框架填充内容。建立框架网页，并为各个框架填充内容。u调整框架网页的外观。调整框架网页的外观。5.1.
2、1 5.1.1 什么是框架什么是框架 FrontPage FrontPage提供的框架技术，可以方便地把一个完提供的框架技术，可以方便地把一个完整的浏览器窗口分割成若干个单个独立的小窗口，这整的浏览器窗口分割成若干个单个独立的小窗口，这些独立的小窗口被称为些独立的小窗口被称为“框架框架”，每个框架有自己相，每个框架有自己相对独立的内容，并且可以互不干扰地变化、翻动。对独立的内容，并且可以互不干扰地变化、翻动。 “ “框架框架”只给网页划分区域，并不提供实只给网页划分区域，并不提供实际内容，每个框架都可以显示独立的网页。本际内容，每个框架都可以显示独立的网页。本节中节中“框架网页框架网页”指的是
3、存放框架页面的指的是存放框架页面的“容容器器”，而框架页面指的是各个框架所对应的页，而框架页面指的是各个框架所对应的页面。面。 在在FrontPage中，创建框架网页唯一的办法，就是中，创建框架网页唯一的办法，就是通过模板来进行。通过模板来进行。 框架网页本身并不包含可视内容，它只是一个展框架网页本身并不包含可视内容，它只是一个展示页面内容的容器，因此框架的布局成为框架网页设示页面内容的容器，因此框架的布局成为框架网页设计的关键性技术。计的关键性技术。5.1.2 5.1.2 创建框架网页创建框架网页 创建框架网页的步骤创建框架网页的步骤 :(1)(1)“文件文件”菜单菜单(1)(1)“新建新建
4、”子菜单子菜单(2)(2) “ “网页网页”命令命令(3)(3)“新建新建”任务面板任务面板(4)(4)“新新建建网网页页”一一栏栏中中的的“其其他他网页模板网页模板”选项选项(5)(5)“网页模板网页模板”对话框。对话框。(2) “网页模板网页模板”对话框对话框“框架网页框架网页”选项卡。选项卡。(3) (3) 根根据据需需要要选选择择一一个个框框架架模模板板，这这时时可可以以在在右右边边的的说说明明栏栏中中看看到到该该框框架架模模板板的的说说明明文文字字，并并在在右右下下方方的的预预览框中预览该框架模板。览框中预览该框架模板。(4) (4) 单击单击“确定确定”按钮，完成框架网页的创建。按
5、钮，完成框架网页的创建。 5.1.3 5.1.3 填充框架填充框架 1. 1. 创建初始网页创建初始网页 创创建建完完框框架架后后，就就可可以以确确定定各各框框架架中中放放置置的的页面了。每一个框架中都有两个按钮：页面了。每一个框架中都有两个按钮：所谓所谓“初始网页初始网页”就就是打开框架网页时，是打开框架网页时，在各框架中第一眼看在各框架中第一眼看到的页面到的页面。 如果要将网站中已存在如果要将网站中已存在的网页放入框架中，则的网页放入框架中，则单击单击“设置初始网页设置初始网页”按钮。按钮。 执行下列操作即可将指定的页面执行下列操作即可将指定的页面显示在框架网页的相应框架中：显示在框架网页
6、的相应框架中：单击单击“设置初始网页设置初始网页”按钮按钮“插入超链接插入超链接”对话框对话框找到并选中这个页面找到并选中这个页面“确定确定”如果没有现成的网页可以使用，则如果没有现成的网页可以使用，则可单击可单击“新建网页新建网页”按钮，即时新按钮，即时新建该框架所对应的初始网页。然后建该框架所对应的初始网页。然后像编辑一般网页一样完成该网页的像编辑一般网页一样完成该网页的制作。制作。 2. 2. 编辑与保存框架页面的内容编辑与保存框架页面的内容 (1) (1)编辑框架页面的内容编辑框架页面的内容鼠标单击相应的框架鼠标单击相应的框架直接在框架中编辑直接在框架中编辑“框架框架”菜单菜单/“/“
7、在新窗口中打开网页在新窗口中打开网页”框架太小不好操作框架太小不好操作框架好操作框架好操作(2)(2)保存框架网页保存框架网页以以 “ “横幅和目录横幅和目录”框架网页为例，说明框架网页的保存：框架网页为例，说明框架网页的保存：“横幅和目录横幅和目录”结构的框架网页结构的框架网页需要保存以下四项内容需要保存以下四项内容上框架页面上框架页面 左框架页面左框架页面框架网页框架网页右框架页面右框架页面5.1.4 5.1.4 框架的调整、拆分和删除框架的调整、拆分和删除 1. 1. 拆分框架拆分框架 (1) (1) 选中要拆分的框架选中要拆分的框架 (2) “ (2) “框架框架”菜单菜单/“/“拆分
8、框架拆分框架”命令命令 (3) /“ (3) /“拆分成列拆分成列”或或“拆分成行拆分成行”/“”/“确定确定” ” 2. 2. 删除框架删除框架 事实上删除框架就是将两个框架合二为一。事实上删除框架就是将两个框架合二为一。 （1 1）选中要删除的框架）选中要删除的框架 （2 2）“框架框架”菜单菜单“删除框架删除框架”命令命令 若若确确定定被被删删除除的的框框架架所所对对应应的的页页面面已已无无保保留留价价值值，则则可可在文件夹列表中将其删掉。在文件夹列表中将其删掉。3. 3. 设置框架属性和框架网页属性设置框架属性和框架网页属性 通过设置框架的属性，可以调整框架的大小、边距、是否通过设置框
9、架的属性，可以调整框架的大小、边距、是否带滚动条等等。带滚动条等等。 “框架框架”菜单菜单“框架属性框架属性”命令命令单击鼠标右键，单击鼠标右键，打开快捷菜单，打开快捷菜单，选择选择“框架属性框架属性”命令，命令，弹出弹出“框架属性框架属性”对话框对话框或或选中要设置框架属性的框架选中要设置框架属性的框架设置框架属性设置框架属性“框架属性框架属性”对话框对话框 输入框架的名称输入框架的名称 输入另外的网输入另外的网页文件名称，页文件名称，以改变框架的以改变框架的初始网页初始网页确定确定“列宽度列宽度”和和“高度高度”。 指定框架边框与框指定框架边框与框架内容的间距架内容的间距 访问者在浏览时，
10、访问者在浏览时，可以自行调整框可以自行调整框架大小架大小指定滚动条出现指定滚动条出现的条件的条件 “框架属性框架属性”对话框对话框 单击单击“框架网页框架网页”按钮，将打开按钮，将打开“网页属网页属性性”对话框，在这里可对话框，在这里可以对框架网页进行网页以对框架网页进行网页属性的设置。属性的设置。要注意，此时的设要注意，此时的设置，将应用于所有的框置，将应用于所有的框架。架。 4. 4. 设置目标框架设置目标框架 框框架架网网页页中中各各框框架架里里的的内内容容相相对对独独立立、互互不不干干扰扰，当当浏浏览览者者点点击击某某个个窗窗口口中中的的超超链链接接时时，将将在在什什么么位位置置打打开
11、开链链接接目目标标，是是一一个个有有待待确确定定的的问问题题，这这时时就就需需要要设设置置目目标标框框架架。目目标标框框架架就是链接目标打开的位置。就是链接目标打开的位置。 为超链接设置目标框架的步骤将光标置于链接源上将光标置于链接源上单击鼠标右键单击鼠标右键“插入超链接插入超链接”对话框对话框“目标框架目标框架”按钮弹出按钮弹出“目标框架目标框架”对话框对话框 “当前框架网页当前框架网页”一栏单击示意图中的某个框架一栏单击示意图中的某个框架在在“目标设置目标设置”一栏的文本框中将显示该框架的名称。一栏的文本框中将显示该框架的名称。 确定确定网页默认值：由模板默认的目标框架。网页默认值：由模板默认的目标框架。相相同同框框架架：将将超超链链接接所所在在的的框框架架作作为为目标框架，框架名称为目标框架，框架名称为_self。整整页页：将将整整个个浏浏览览器器窗窗口口作作为为目目标标框框架。框架名称为架。框架名称为_top。新新建建窗窗口口：超超链链接接所所指指向向的的链链接接目目标标将将在在新新的的窗窗口口中中打打开开。框框架架名名称称为为_blank。父父框框架架：将将某某个个框框架架拆拆分分成成两两个个框框架架后后，该该框框架架即即为为后后两两个个框框架架的的父父框框架架。框架名称为框架名称为_parent。
