Dreamweaver网页制作教案 联系客服

发布时间 : 星期日 文章Dreamweaver网页制作教案更新完毕开始阅读112e369765ce050876321372

认识Dreamweaver

一、学习目的

了解Dreamweaver,学会利用Dreamweaver制作网页。 二、学习内容

Dreamweaver的基本知识。 【学习步骤】

1、 Dreamweaver的功能

Dreamweaver可以像普通的字处理软件一样编辑Internet上以HTML格式保存的所有文件,

也就是网页;它支持动态HTML,可以在网页中产生动画;还可以在网页中插入各种插件,以产生特殊效果。

Dreamweaver可用于管理站点,它像文件夹一样创建和打开站点,用不同的方式查看站点中各个网页之间的关系,调整站点的组织结构,使整个站点条理清晰。

2、 Dreamweaver的窗口

(1) 标题栏 (2) 菜单栏 (3) 工具栏 (4) 视图栏 (5) 文件夹列表 (6) 工作区

3.网页工作区的三个视图方式选项

它们分别是“普通”、“HTML”“预览”,它们之间的相互切换十分容易实现 的。

普通视图方式是Dreamweaver对网页所见即所得编辑方式的最佳体现,在此方式下,可以

像在Word中那样直接进行各种编辑操作,实现网页编辑的所有功能。

HTML视图实际上是一个文本编辑器,其中给出了普通视图方式下所件网页的HTML代码。在这里可以用菜单命令进行复制、粘贴、删除、查找等操作。对于HTML语言中的不同成分均用不同的颜色显示,这样比较容易区分各种语法成分。

为了在制作网页过程中能够随时查看网页的实际效果,Dreamweaver提供了预览视图方式。

4.安装dreameaver的方法 安装及注册 5.关闭dreameaver 6.保存网页的方法

三、小结

Dreamweaver的基本知识

建立一个简单的站点

一、学习目的

了解Dreamweaver,学会利用Dreamweaver制作网页。 二、学习内容

Dreamweaver的基本知识;建立一个简单的站点;进行简单的网页编辑。

【学习步骤】

1、创建空白站点。

执行菜单命令“文件”—“新建”—“站点”,就会出现8中站点向导。出于简单,可

选择“空站点”按钮,并在“指定新站点的位置”框中填入站点的位置。在指定新站点的位置后,单击“确定”即建成一个空站点。

2、建立一个简单的文字网页

建立了一个站点之后,就应该在站点中加入网页了。 ① 创建空白网页

执行菜单命令“文件”—“新建”—“网页”,就会出现一对话框,选择“普通网页”

模板并单击“确定”即建立了一个新的空白页面。

② 网页工作区的三个视图方式选项

它们分别是“普通”、“HTML”“预览”,它们之间的相互切换十分容易实现 的。

普通视图方式是Dreamweaver对网页所见即所得编辑方式的最佳体现,在此方式下,可以像在Word中那样直接进行各种编辑操作,实现网页编辑的所 有功能。

HTML视图实际上是一个文本编辑器,其中给出了普通视图方式下所件网页的HTML代码。在这里可以用菜单命令进行复制、粘贴、删除、查找等操作。对于HTML语言中的不同成分均用不同的颜色显示,这样比较容易区分各种语法成分。

为了在制作网页过程中能够随时查看网页的实际效果,Dreamweaver提供了预览视图方式。

③ 输入文本

网页中最基本的也是最重要的部分就是网页中由文本构成的内容,因此制作 网页首先要从文本输入开始。

3、设置网页中文字的字体、颜色、大小和效果

① 在文本开始处按下鼠标左键,不放手拖到结束处,选择要设置的文本块。 ② 执行菜单命令“格式—字体”。

③ 在“字体”对话框中,单击“字体”选项卡。

④ 在字体选择窗口中,选定所需要的字体,再确定文本的字型、大小、颜色、效果等。 ⑤ 按“确定”即可。 4、 网页编辑

(1) 将图片插入网页 (2) 将剪贴画插入网页 (3) 加入GIF动画 (4) 保存嵌入式图形文件 (5) 使用图片工具栏 (6) 设置图片属性 (7) 设置网页背景 (8) 设置超链接 (9) 应用框架 (10) 表单的使用 5、小结

简单站点的建立过程