《DreamweaverMX2004基础.ppt》由会员分享，可在线阅读，更多相关《DreamweaverMX2004基础.ppt（14页珍藏版）》请在三一文库上搜索。
1、第 二章 Dreamweaver 基础,Dreamweaver是目前最流行的网页制作工具，是集网页制作和管理网站于一身的所见即所得网页编辑器，利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页。,所见所得型网页制作工具：创建的网页文件在编辑过程中的显示与文件最终在浏览器中显示的效果是一样的，用户不需要接触HTML源代码就可以做出希望要的页面。 如Dreamweaver，Fontpage,Dreamweaver最大的特点在于其全新的软件操作界面、强大的动态网页编辑功能和开放的插件环境。,3.1 认识Dreamweaver,Dreamweaver 的操作界面,1、工作区布局选择
2、,在Windows 中首次启动Dreamweaver 时，会出现一个对话框。,2、Dreamweaver 的工作窗口,标题栏,菜单栏,编辑区,文档栏,属性面板,面板组,3.2 Dreamweaver的基本操作,3.21 制作一个简单的网页,2.新建一个网页文件 使用菜单“文件”“新建”或单击工具栏“标准”栏上的“新建”按钮 ，打开“新建文档”对话框。,1.准备 在计算机上的目录下新建一个文件夹，命名为自己的网站名。例如：“学习网站”。,3.输入文字,4.插入图片 在“插入”工具栏选择“常用”标签，在工具按钮的插入图像下拉式菜单中选择“图像”，打开“选择图像源文件”对话框。,5.保存文件 使用菜
3、单“文件”“保存”或单击“标准”工具栏上的“保存”按钮 。,6.在浏览器中预览网页 单击标准工具栏上的预览按钮 或按F12可在浏览器中预览所编辑的网页。,7.在多个文件间转换 再新建两个文件xuexi01.htm和xuexi02.htm并打开它们，此时编辑窗口上部会有3个包含文件名的选项卡，点击可以将编辑窗口在多个文件间切换。 在某个选项卡上右击，在弹出菜单中选择“关闭”可关闭当前编辑的网页。,3.22 设置工作界面,1.关闭面板 按F4可关闭和打开全部面板。,2.标尺和网格 使用菜单“查看”“网格”“显示网格”和“查看”“标尺”“显示标尺”可以打开或关闭网格和标尺的显示。,3.辅助显示 使用
4、菜单“查看”“可视化助理”可设置排版过程中的一些辅助显示的边框、替代元素（如锚点标记）是否显示。 在代码视图或拆分视图模式下，使用菜单“查看”“代码视图选项”可设置代码显示的模式，如是否显示行数,4.首选参数设置 使用菜单“编辑”“首选参数”打开首选参数对话框，可设置网页文件的缺省状态和编辑窗口的显示效果,3.23 对象的大小和颜色,1.修改文字大小 在属性面板上的大小中选择文字的大小，文字大小可设置绝对尺寸、相对尺寸、长度、百分比,2.修改文字颜色 在默认的情况下，文本在浏览器窗口内显示为黑色。在属性面板的文本颜色按钮 上单击可打开调色板，选择要设置的颜色。,3.24 设置图像大小的多种操作
5、方式,1.拖动改变大小 拖动图像下边、右边、右下角的三个控制点可快速改变图像大小。,2.使用属性面板 在属性面板的宽、高栏输入宽、高的像素值，可改变图像大小。,3.使用右键菜单 在图像上面单击右键，在弹出菜单中选择“改变大小”可重设图像大小。,6.使用面板组的属性面板 使用菜单“窗口”“属性”或单击“标签检查器”面板组打开属性面板，在编辑窗口中选中要设置大小的图片，再单击“常规”前面的加号，列出图片的各种属性，在width和height中设置图片大小的值 。,4.使用系统菜单 使用菜单“修改”“图像”虽然不能修改图像的大小，但可以改变图像的其他属性。,5.使用代码编辑器 将显示模式设为代码模式
6、或拆分模式，可直接编辑图片文件的HTML代码中的width和height属性的值，改变图像大小 。,3.1 Dreamweaver设计人员工作区和代码设计者工作区有什么区别？ 3.2 “插入”工具栏有什么作用？ 3.3 使用Dreamweaver制作一个网页有哪些步骤？ 3.4 网页中文字的大小和颜色定义可以取哪些值？颜色的英文表示和 十六进制表示如何对应？ 3.5 有几种方法可以改变图像的大小？,思考题,上机练习题：,上机练习2.1 1.练习目的：学习修改Dreamweaver 的操作界面。 2.练习步骤： （1）新建一个网页。 （2）切换“插入”栏的显示方式。 （3）使用“窗口”菜单打开和关闭各种面板和面板组，查看面板组的结构和显示方式。 （4）在网页中输入一些文字，切换三种视图模式，查看并纪录生成的HTML代码。,上机练习2.2 1.练习目的：学习制作网页的基本技能。 2.练习步骤： （1）在计算机上建立一个自己的文件夹，然后制作一个网页，网页中要包含文字和图像，文字的颜色、大小要有所变化。 （2）将制作的网页在浏览器中浏览。 （3）设置工作界面。包括代码的文字大小、颜色、显示网格等。,