资源预览内容
第1页 / 共15页
第2页 / 共15页
第3页 / 共15页
第4页 / 共15页
第5页 / 共15页
第6页 / 共15页
第7页 / 共15页
第8页 / 共15页
第9页 / 共15页
第10页 / 共15页
亲,该文档总共15页,到这儿已超出免费预览范围,如果喜欢就下载吧!
资源描述
第2章 Dreamweaver 8基础,教学提示和教学目标 2.1 Dreamweaver 8简述 2.2 Dreamweaver 8的新增功能 2.3 Dreamweaver 8的操作界面 2.4 文档的基本操作,教学提示和教学目标,教学提示:Dreamweaver 8是针对网页设计者而特别开发的可视化网页设计工具,作为一个所见即所得的网页编辑器,Dreamweaver 8为用户提供了方便快捷的插入栏、菜单栏、属性面板和站点管理窗口等工具,不仅使得制作过程更加直观,同时也大大简化了网页制作的步骤。 教学目标: 熟悉Dreamweaver 8的主要功能 熟悉Dreamweaver 8的新增功能 熟悉Dreamweaver 8的工作界面 掌握页面属性的设置 掌握站点的创建和管理,2.1 Dreamweaver 8简述,reamweaver 8是一款专门的网页设计软件,它采用所见即所得的编辑方式,利用行为、CSS、模板等技术对Web站点、网页和Web应用程序进行设计、编码和开发。无论用户是愿意享受手工编写HTML代码时的驾驭感还是偏爱在可视化编辑环境中工作,Dreamweaver 8都会为用户提供有用的工具,使用户拥有更加完美的Web创作体验。另外除了强大的网页编辑功能外,Dreamweaver 8还提供了完善的站点管理功能。 利用Dreamweaver 8中的可视化编辑功能,用户可以快速地创建页面而无需编写任何代码。用户可以查看所有站点元素和资源并将它们从面板直接拖到文档中,也可以在Fireworks或其他图形应用程序中创建和编辑图像,然后将它们直接导入Dreamweaver 8中,从而优化开发工作流程。,2.2 Dreamweaver 8的新增功能,Dreamweaver 8包含了许多新增的功能,这些新增功能改善了软件的易用性,无论处于设计环境还是编码环境都可以方便地制作页面。 1. 用户界面的改进 2. 多种样式呈现面板 3. 新的标准CSS面板 4. Flash视频 5. 缩放功能,2.3 Dreamweaver 8的操作界面,Dreamweaver 8的操作界面是由标题栏、菜单栏、插入栏、文档窗口、状态栏、属性面板以及多个浮动面板组成,如图2.8所示。 2.3.1 菜单栏 2.3.2 插入栏 2.3.3 浮动面板 2.3.4 【属性】面板 2.3.5 文档窗口,2.3.1 菜单栏,菜单栏中共包含10个菜单项,分别是【文件】、【编辑】、【查看】、【插入】、【修改】、【文本】、【命令】、【站点】、【窗口】和【帮助】,如图2.9所示,下面逐一介绍每个菜单的功能。,2.3.2 插入栏,插入栏包含各种类型的对象,如图像、表格和层。每个对象都是一段HTML代码,允许在插入时设置不同的属性,可以通过单击插入栏中的按钮插入表格,也可以不使用插入栏而使用插入菜单插入对象。如图2.10所示。,2.3.3 浮动面板,Dreamweaver 8中的面板统称为浮动面板,这些面板浮动于文档窗口之外,如图2.11所示,若要展开一个面板,单击面板名称左侧的展开箭头。 Dreamweaver 8提供了多种面板,可以利用【窗口】的子菜单命令打开。,2.3.4 【属性】面板,【属性】面板如图2.12所示,用于显示网页中各个元素的相关属性,用户可以通过设置【属性】面板中的各选项,对网页中的各个属性做精确的修改。 【属性】面板的内容会随当前所选定元素的不同而发生变化,在以后的章节中将结合具体的实例来讲述具体的设置。对于【属性】面板所做的大多数设置会立刻应用到文档窗口中。但是对于有些属性,则要在属性编辑文本域外单击并按Enter键,或者按Tab键切换到其他属性才会使更改生效。,2.3.5 文档窗口,如图2.13所示是文档窗口,文档窗口用于显示当前创建和编辑的网页文档。可以在设计视图、代码视图、拆分视图中查看文档内容。,2.4 文档的基本操作,Dreamweaver 8为网页设计和开发提供了灵活的开发环境,除了HTML文档以外,还可以创建打开各种基于文本的文档。 2.4.1 新建网页 2.4.2 打开网页 2.4.3 保存网页 2.4.4 设置页面属性,2.4.1 新建网页,(1)启动Dreamweaver 8软件。选择【文件】|【新建】命令,弹出【新建文档】对话框,在对话框中选择【类别】列表框的【基本页】选项,在【基本页】列表框中选择HTML选项。 (2)单击【创建】按钮,显示创建的HTML网页编辑窗口。 (4)选择【文件】|【保存】命令,弹出【另存为】对话框,在【保存在】下拉列表框中选择文件保存路径。在【文件名】文本框中输入index。 (5)单击【保存】按钮,返回网页编辑窗口新的空白网页创建完成。,2.4.2 打开网页,要打开网页,在【文件】面板中展开Dreamweaver文件夹,然后双击要打开的文件,该网页将出现在新的文档窗口中;或者在本地电脑上打开网页文档所在的文件,直接双击即可打开网页文档;或者在要打开的网页上,单击鼠标右键,在弹出的快捷菜单中选择【打开】命令,即可打开网页文档。,2.4.3 保存网页,新建网页后,需要对网页进行保存,在网页制作过程中需要养成随时保存网页的良好习惯,防止由于计算机的故障使制作好的网页丢失,造成不必要的损失。 (1) 在Dreamweaver编辑窗口中,选择【文件】|【保存】命令,弹出【另存为】对话框,在对话框中选择保存网页的位置,在【文件名】文本框中输入要保存文档的名称index,【保存类型】设置为【*所有文档(*.htm;)】。 (2) 单击【保存】按钮,完成网页的保存。,2.4.4 设置页面属性,(1)选择【修改】|【页面属性】命令,弹出【页面属性】对话框,在对话框可以设置关于整个文档的一些信息,在【外观】选项中可以设置页面的一些基本属性。在【外观】选项中可以进行如下设置。 (2)在【链接】选项中可以设置与页面链接有关的属性。在【链接】选项中可以进行如下设置。 (3)在【标题】选项页中可以设置标题字体和颜色的一些属性。在【标题】选项中可以进行如下设置。 (4)在【标题/编码】选项页中可以设置网页标题和文字编码。在【标题/编码】选项页中可以进行如下设置。 (5)在【跟踪图像】选项页中可以设置跟踪图像的属性。跟踪图像一般在设计网页时作为网页背景,用于引导网页的设计。单击文本框右边的【浏览】按钮,弹出【选择图像源文件】对话框,选择一个图像作为跟踪图像。拖动【透明度】滑块可以指定图像的透明度,透明度越高图像显示得越清晰。 (6)设置完成后,单击【确定】按钮。至此,页面属性设置完毕。,
网站客服QQ:2055934822
金锄头文库版权所有
经营许可证:蜀ICP备13022795号 | 川公网安备 51140202000112号