[政史地]网页设计与制作教学课件4.ppt

4.1.1 网页布局概述 4.1.1 网页布局概述 4.1.1 网页布局概述 4.1.1 网页布局概述 4.1.1 网页布局概述 4.1.2 布局的方法与原则 4.1.2 布局的方法与原则 4.2.1 布局表格概述 4.2.2 任务1建立旅游景点布局表格 4.2.2 任务1建立旅游景点布局表格 4.2.2 任务1建立旅游景点布局表格 4.2.2 任务1建立旅游景点布局表格 4.2.2 任务1建立旅游景点布局表格 4.2.2 任务1建立旅游景点布局表格 4.3.1 框架概述 4.3.1 框架概述 4.3.1 框架概述 4.3.2 框架的创建与编辑 4.3.2 框架的创建与编辑 4.3.2 框架的创建与编辑 4.3.2 框架的创建与编辑 4.3.2 框架的创建与编辑 4.3.2 框架的创建与编辑 4.3.2 框架的创建与编辑 4.3.2 框架的创建与编辑 4.3.2 框架的创建与编辑 4.3.2 框架的创建与编辑 4.3.2 框架的创建与编辑 4.3.2 框架的创建与编辑 4.3.3 任务2“常见问题”框架网页设计 4.3.3 任务2“常见问题”框架网页设计 4.3.3 任务2“常见问题”框架网页设计 4.3.4 内嵌框架Iframe 4.3.4 内嵌框架Iframe 4.3.4 内嵌框架Iframe 4.3.4 内嵌框架Iframe 4.4.1 模板网页概述 4.4.2 创建模板 4.4.2 创建模板 4.4.2 创建模板 4.4.2 创建模板 4.4.2 创建模板 4.4.2 创建模板 4.4.3 任务3 创建景点介绍模板网页 4.4.3 任务3 创建景点介绍模板网页 4.4.3 任务3 创建景点介绍模板网页 4.4.3 任务3 创建景点介绍模板网页 4.4.4 任务4 利用模板生成“景点介绍”网页 4.4.4 任务4 利用模板生成“景点介绍”网页 4.4.4 任务4 利用模板生成“景点介绍”网页 4.4.4 任务4 利用模板生成“景点介绍”网页 4.4.5 任务5 设计重复区域模板网页 4.4.5 任务5 设计重复区域模板网页 4.4.5 任务5 设计重复区域模板网页 4.4.6 任务6 利用可重复区域模板创建风光图库网页 4.4.6 任务6 利用可重复区域模板创建风光图库网页 4.3 框架布局 3．编辑框架 （1）调整框架大小 也可以通过鼠标在框架的边框上进行调整，当鼠标指针变成双向箭头时，用鼠标左键拖动框架即可。 （2）拆分框架 如果系统默认的框架不符合设计的需要，或者要设计更为复杂的框架结构，可以通过对框架进行拆分，来完成自定义的框架布局结构，利用Drameweaver CS5的菜单选项“修改”→“框架集”中的拆分选项，可以进行拆分操作，选项有：“拆分左框架”，“拆分右框架”，“拆分上框架”，“拆分下框架” 拖动点 4.3 框架布局 例如：在一个已有框架的内部，拆分出一个下框架，如图（a）所示，可以在单击框架内部，然后，在菜单栏中选择 “修改”→“框架集”→“拆分下框架”，拆分的结果如图（b）所示，在中间的框架内，可以继续“拆分右框架”，得到一组由4个框架组成的框架集，如图（c）所示。 在此框架内 拆分下框架 在此框架内 拆分右框架 （a） （b） （c） 4.3 框架布局 （3）删除框架 如果不需要某个框架，可以将其删除，其方法很简单，用鼠标将要删除框架的边框拖至框架集以外即可。 Questions rightFrame topFrame left Frame bottomFrame 4．保存框架 如果框架集中包含了topFrame、leftFrame、rightFrame和bottomFrame框架，每个框架包含一个文件，这样一个框架集会包含多个文件，在保存网页时，需要有多个文件保存过程才能将整个网页文档都保存下来，如图所示的框架为例，需要对框架中的4个部分分别命名进行保存。 4.3 框架布局 步骤1 保存框架集：在菜单栏中选择“文件”→“保存全部”命令，整个框架边框会出现一个阴影框，表示要保存整个框架集，同时会弹出“另存为”对话框，命名为“Questions.html” 步骤2 保存框架：在保存框架集后，会出现第2个“另存为”对话框，此时分别对每个框架命名保存： 上框架为“topFrame.html”， 左框架为“leftFrame.html”， 右框架为“rightFrame.html”， 下框架为“bottomFrame.html” 4.3 框架布局 步骤1打开“Questions.html”网页文件，插入网页文件。