第八讲 框架与模板.pptVIP

框架和框架集简介 框架的功能是把浏览器窗口划分为若干个区域，分别显示不同的网页。 框架集的功能是定义一组框架的布局和属性。 利用框架可以把浏览器窗口划分为若干个区域，在每个区域中可以添加任意网页元素，也可以分别显示不同的网页。 框架和框架集简介 框架集与框架之间的关系其实就是包含与被包含的关系，框架集相当于一个容器，框架则是放在容器中的东西，框架集记录了框架的位置以及框架中包含的网页的链接地址 框架和框架集简介 框架和框架集简介 用框架进行网页布局的规则和技巧 创建框架或框架集后可对其属性进行设置 每个框架就是不同的HTML页面，因此需要分别保存每个框架文件和框架集文件 要确保文件中的每个超链接都正确 框架和框架集的创建与保存 直接创建预定义框架集 加载预定义框架集 手动创建框架集 框架和框架集的创建与保存 框架及框架集的保存 保存框架文档 将光标定位到需保存的框架中，选择文件-保存框架命令 保存框架集文档 选中需要保存的框架集，选择文件-保存框架页 保存框架集中的所有文档 文件-保存全部 框架与框架集的基本操作 认识框架面板 选中框架框架集 删除框架 如果要删除不需要的框架，用鼠标将要删除框架的边框拖至页面外即可；如果是嵌套框架，则将其边框拖到父框架边框上或拖离页面即可。 框架及框架集的属性设置 框架集创建好后，可在各框架中直接添加网页内容；也可分别制作各框架要链接的网页，然后在【属性】面板中进行链接。在【属性】面板中可以设置框架的属性，如框架的名称、框架的源文件、框架的空白边距、框架的滚动特性、框架的大小特性以及框架的边框特性等。 设置框架的属性 设置框架集的属性 典型案例——制作在线小说框架网页 创建【示例中的页】-【框架集】-【上方固定，下方固定】 将中间框架进行拆分、调整，使中间具有3个框架 将顶部框架保存为”top.html” 其他四个框架依次命名为”left.html”、”main.html”、”right.html”、”bottom.html“ 将框架集的页面命名为”index.html” 框架的基本语法 语法格式： 框架的基本语法 框架的基本语法 要实现如下图所示的窗口，该如何制作？ 框架的基本语法 创建步骤 创建一个HTML页面“top.html” 创建一个HTML页面“left.html” 创建一个HTML页面“right.html” 框架的基本语法 新建多框架HTML页面Frame_Sets.html 框架的基本语法 如果在同一个页面中，要实现在一个框架窗口中的超链接页面出现在另一个框架窗口中，如何实现？ 框架基本语法 target目标窗口属性 name＝显示的窗口名 frame src=url name=窗口名　　 a href=url target=窗口名 典型案例——制作“在线小说”网页 打开框架集网页”index.html“，设置所有边距为”0像素” 同样设置left.html、right.html、bottom.html 将光标置于中间框架网页”main.html”中，页面属性设置为字号”12px”、背景图像”index2_03.jpg”、重复为”不重复”、所有边距”0像素”、变换图像链接和已访问链接颜色设置为”#736856” 打开top.html、left.html、right.html、bottom.html网页分别添加图像 典型案例——制作“在线小说”网页 将光标置于中间框架网页”main.html“中，插入一个2行2列，宽度为96%的表格，设置第2行第2列单元格的水平对齐方式为”左对齐“、垂直对齐方式为”顶端对齐“，然后输入相应的文本内容，添加链接 打开body的CSS规则定义，在背景-附件下拉列表中选择”固定“ 设置顶部框架高度为96px，底部框架高度为101px 设置中间框架的宽度依次为180、204 设置左侧和右侧框架滚动方式为不滚动 模板的创建 利用模板可以更好的统一网站的板式 模板是Dreamweaver中提供的一种特殊的网页文档，其编辑方法和普通网页的编辑方法一样，只是可以在其中添加可编辑区域。所有应用了模板的网页都具有和模板相同的版式和内容，并可以在可编辑区域中输入新的内容。对模板进行修改后，所有应用模板的网页也会做相同的修改。 模板的创建 模板必须保存在站点中，因此在创建模板前应先创建站点。在创建模板时，有将现有网页另存为模板和新建空白模板两种方法。 将网页另存为模板 文件-另存为模板 模板文件的扩展名为“.dwt” 创建空白模板 创建站点 站点是什么 操作步骤 站点-新建站点 教材269页 模板的编辑 创建可编辑区域 可编辑区域的指可以进行添加、修改和删除等操作的区域 在常用插入栏中单击按钮，