《08创建和使用框架.ppt》由会员分享，可在线阅读，更多相关《08创建和使用框架.ppt（20页珍藏版）》请在三一文库上搜索。
1、第8章 创建和使用框架 重点内容： 创建框架与框架集 选择框架与框架集的方法 设置框架与框架的属性 编辑框架页面,一、 框架与框架集的概念 1.框架与框架集的用途 框架最常见的用途是导航。一组框架通常包括一个含有导航条的框架和另一个要显示主要内容页面的框架。但是，框架的设计比较复杂；而且在很多情况下，可以不必创建框架就能达到相同的效果。例如，如果想让导航条显示在页面的左侧，则既可以用一组框架代替的页面，也可以只是在站点中的每一页上包含该导航条。,一、 框架与框架集的概念 2.框架与框架集的工作方式 框架不是文件，它只是存放文档的容器。其中的文档并不是框架的一部分。使用框架最常见的情况是：一个框
2、架显示包含导航控件的文档，另一个框架显示含有内容的文档。框架集文件本身不包含要在浏览器中显示的HTML内容，它只是向浏览器提供应如何显示一组框架，以及在这些框架中应显示哪些文档的有关信息。在Dreamweaver中设计使用框架集的页面时，必须保存所有文件，该页面才能在浏览器中正常显示。,一、 框架与框架集的概念 3.使用框架集时应执行的常规步骤 （1）创建框架集并指定要在每个框架中显示的文档。 （2）保存将要在框架中显示的每个文件。注意，由于每个框架都显示单独的HTML文档，因此必须保存每个文档以及该框架集文件。 （3）设置每个框架和每个框架集的属性，如为各框架命名、设置滚动和不滚动选项等。
3、（4）在属性检查器中为所有链接设置“目标”属性，以便链接目标的内容显示在正确区域中。,二、 创建框架与框架集 1.使用预定义创建框架集 将插入点置于文档窗口中，然后单击“布局”工具栏中的“框架”按钮 右侧的三角按钮，从弹出的菜单中选择所需的框架类型。“框架”菜单中提供了13种框架类型。,二、 创建框架与框架集 2.自定义框架集 将鼠标指针移至框架边框上，当鼠标指针变为双向箭头形状时按下鼠标左键向文档窗口内拖动，即可创建任意框架集。,二、 创建框架与框架集 3.删除框架 将指针指向此框架的边框，当指针形状变为双向箭头时拖动该边框至文档窗口边框或其父框架的边框上，即可删除页面上的框架。如果要删除的
4、框架中包含尚未保存的文档，Dreamweaver将提示用户保存该文档。通过拖动边框的方式不能完全删除框架集。要删除框架集，可以通过关闭显示它的文档窗口来实现。如果该框架集文件已保存，可删除该文件。,二、 创建框架与框架集 4.创建嵌套框架集 将插入点置于要创建嵌套框架集的框架中，然后利用创建框架集的命令创建嵌套框架集。,三、 选择框架与框架集 1.在文档窗口中选择 在文档窗口的设计视图中，按住Alt键单击框架内部，即可选择该框架。单击框架集的某一内部框架边框则可选择一个框架集。此外，执行以下方法之一还可在选择某个框架或框架集的基础上选择其他框架或框架集： （1）选择与当选所选内容同一层次级别的
5、下一框架（框架集）或前一框架（框架集）：按住Alt键的同时按下左箭头键或右箭头键。 （2）选择父框架集：按住Alt键的同时按上箭头键。 （3）选择当前选择框架集的第1个子框架或框架集：按 住Alt键的同时按下箭头键。,三、 选择框架与框架集 2.在框架面板中选择 在“框架”面板中单击要选择的框架或框架集的边框，即可选中相应元素。被选中的元素边框以高亮显示。,四、 设置框架与框架集的属性 1.设置框架属性 选择某个框架后，属性检查器中显示该框架的相关属性，用户可在其中设置框架名称、源文件、滚动条、边框及边框颜色等选项。,四、 设置框架与框架集的属性 2.设置框架集属性 选择某个框架集后，属性检查
6、器中显示该框架集的相关属性，用户可在其中设置框架集的边框、边框颜色、边框宽度等属性。,五、 编辑框架页面 1.在框架中打开文档 如果要在框架中插入新内容，只须按照在普通页面中添加内容的方法来进行操作即可。如果要在框架中打开已有的文档，可将插入点放置在要插入内容的框架中，然后选择“文件”“在框架中打开”命令，打开“选择HTML文件”对话框，选择要打开的文档，单击“确定”按钮，这时会打开一个提示对话框。若要使该文档成为在浏览器中打开框架集时在框架中显示的默认文档，应单击“是”按钮保存该框架集。,五、 编辑框架页面 2.设置框架中文档的背景 将插入点置于要设置背景的框架文档中后，即可像在普通页面一样
7、打开“页面属性”对话框，设置当前框架中文档的背景颜色或背景图像。,五、 编辑框架页面 3.控制框架内容 在设计视图中选择要作为超链接的文本或对象，然后在属性检查器中的“链接”文本框中指定要链接的文件，并在“目标”下拉列表框中选择链接的文档应在其中显示的框架或窗口：“_blank”：用于在新的浏览器窗口中打开链接目标文档，同时保持当前窗口不变：“_parent”：用于在显示链接的框架的父框架集中打开链接的文档，同时替换整个框架集；“_self”：用于在当前框架中打开链接目标，同时替换该框架中的内容；“_top”：用于在当前浏览器窗口中打开链接目标文档，同时替换所有框架。,五、 编辑框架页面 4.
8、替换框架文件 将插入点置于要替换的框架文件内，然后选择“文件”|“在框架中打开”命令，打开“选择HTML文件”对话框，选择要替换的文件后单击“确定”按钮。也可以在“框架”面板中选择要替换的框架，并在属性检查器中的“源文件”文本框中输入要替换成的文本路径，或者单击其右侧的文件夹图标查找要替换的文件。,五、 编辑框架页面 5.保存框架和框架集文件 保存框架集文件：选择框架集后选择“文件”|“保存框架页”命令，或选择“文件”|“框架集另存为”命令，打开“另存为”对话框。在“文件名”文本框中输入要保存框架集的名称。 保存在框架中显示的文档：单击文档所在的框架，然后选择“文件”|“保存框架”命令或选择“
9、文件”|“框架另存为”命令，打开“另存为”对话框。 保存与一组框架关联的所有文件：可以选择“文件”|“保存所有框架”命令。,五、 编辑框架页面 6.解决浏览器无法显示框架的问题 选中框架集，然后选择“修改”|“框架集”|“编辑无框架内容”命令。此时Dreamweaver将清除文档窗口，正文区域上方出现“无框架内容”标签。当访问者使用不支持框架的浏览器访问框架网页时，看到的将是一个空白的页面。用户可以在这个空白的页面中加入一段文字，提示访问者使用的浏览器不支持框架，无法显示框架及网页的内容。,六、 思考 什么是框架和框架集？ 怎样替换框架文件？ 在文档窗口中使用框架集时应执行哪些常规步骤？ 如何选择框架和框架集？ 如何解决浏览器无法显示框架的问题？,本章小结： 了解框架和框架集的概念与用途。 掌握创建和使用框架与框架集的方法。 掌握设置框架与框架集的属性及编辑框架页面的方法。 学会如何正确保存框架集。,