Dreamweaver网页设计第13章

第十三讲网页中的动感元素度的2倍：512，左对齐。

预览才可看到生动的波纹效果。

5）插入背景音乐1）插入布局/绘制层/绘制一个层/光标置于层中，插入/媒体/插件：xzm.mid；2）选中插件标记，“参数”：autostart:true，loop:2，代码如下：<embedsrc="00.mid" width="32" height="32" autostart="true"loop="2"></embed>3）选择层，“属性”面板设置层的可见性为hidden（隐藏）5.扩展功能（使用第三方插件）Macromedia Extension Manager 就是功能扩展管理器。

功能扩展管理器可与Dreamweaver、Dreamweaver UltraDev、Fireworks 和Flash 并行运行；功能扩展管理器1.6 支持新版Dreamweaver、Fireworks 和Flash 以及已添加的许多新功能，可支持新的DW 产品套件内的轻松扩展。

课堂实践（1）打开“课堂实践”网站文件夹“09动感元素”中的网页文档“09.html”。

（2）分别在页面的上部和中部插入两个层，在两个层中插入flash动画。

疑难解析问题1：如何将Flash动画的背景颜色设置为透明？答：在网页文档中选中所插入的Flash动画，在Flash的“属性”面板中单击【参数】按钮，弹出“参数”对话框，在该对话框中，在“参数名”文本框输入“Wmode”，在“值”文本框中输入“transparent”，如图8-13所示。

然后单击【确定】按钮即可。

将Flash动画的背景颜色设置为透明，使页面的背景在Flash动画下衬托出来。

图8-13 “参数”对话框问题2：如何在网页中插入Flash视频？答：Dreamweaver 8能够直接在页面中插入Flash视频内容，而无需使用Flash创作工具。

dw网页制作教程DW（Dreamweaver）是Adobe公司的一款专业网页制作软件，功能强大、易于使用，已经成为众多网页设计师的首选工具之一。

下面是一份简单的DW网页制作教程。

第一步：新建网页打开DW软件后，点击“文件”菜单中的“新建”选项，弹出新建文件的对话框。

选择“空白页面”中的“HTML”选项，点击“创建”按钮，即可新建一个空白网页。

第二步：页面布局在DW软件中，可以使用所见即所得的方式设计网页布局。

点击左边的“插入”面板，选择“表格”选项，然后拖动鼠标在网页上划分表格的排列。

在表格中可以添加文本、图片、链接等内容。

第三步：编辑内容通过双击表格中的单元格，可以进入编辑模式，添加文字或图片等内容。

同时，可以在DW软件中选择字体、颜色、对齐方式等格式选项，使网页内容更加美观。

第四步：插入链接点击“插入”面板中的“超链接”选项，选择需要链接的文本或图片，然后填写目标网页的地址，即可添加链接。

第五步：CSS 样式CSS（Cascading Style Sheets）可以实现网页的样式设计，让网页更加美观和易于维护。

点击“窗口”菜单中的“CSS样式表”选项，弹出样式面板。

可以通过样式面板设置文字样式、背景样式、边框样式等。

第六步：网页预览与编辑点击软件界面右上方的“设计视图”按钮，即可在浏览器中预览网页的效果。

同时，可以切换到“代码视图”查看和编辑网页的HTML代码。

第七步：保存与发布点击软件界面上方的“文件”菜单中的“保存”选项，输入文件名和保存位置，即可保存网页。

要发布网页，需要将网页文件和相关资源文件（如图片）上传到服务器，并确保服务器的正确配置。

以上就是DW网页制作的基本流程和操作方法。

当然，这只是一个简单的入门教程，如果想要掌握更多高级技巧和功能，还需要进一步学习和实践。

希望这份教程对您有所帮助！。

网页设计Dreamweaver教案第一章：Dreamweaver概述1.1 课程目标了解Dreamweaver的基本功能和特点熟悉Dreamweaver的工作界面掌握Dreamweaver的基本操作1.2 教学内容Dreamweaver的功能和特点Dreamweaver的工作界面Dreamweaver的基本操作1.3 教学步骤1. 介绍Dreamweaver的功能和特点2. 演示Dreamweaver的工作界面3. 讲解Dreamweaver的基本操作4. 学生练习操作Dreamweaver1.4 作业与练习制作一个简单的网页熟悉Dreamweaver的工作界面第二章：网页设计与布局2.1 课程目标学习网页设计的基本原则掌握网页布局的方法熟悉Dreamweaver的布局工具2.2 教学内容网页设计的基本原则网页布局的方法Dreamweaver的布局工具2.3 教学步骤1. 介绍网页设计的基本原则2. 演示网页布局的方法3. 讲解Dreamweaver的布局工具4. 学生练习网页设计和布局2.4 作业与练习设计并布局一个简单的网页熟悉Dreamweaver的布局工具第三章：HTML标签与属性3.1 课程目标学习HTML标签的基本概念掌握HTML标签的属性和使用方法熟悉Dreamweaver的标签插入工具3.2 教学内容HTML标签的基本概念HTML标签的属性和使用方法Dreamweaver的标签插入工具3.3 教学步骤1. 介绍HTML标签的基本概念2. 演示HTML标签的属性和使用方法3. 讲解Dreamweaver的标签插入工具4. 学生练习插入HTML标签3.4 作业与练习插入并使用HTML标签制作一个简单的网页熟悉Dreamweaver的标签插入工具第四章：CSS样式与布局4.1 课程目标学习CSS样式的基本概念掌握CSS样式的使用方法熟悉Dreamweaver的CSS样式编辑工具4.2 教学内容CSS样式的基本概念CSS样式的使用方法Dreamweaver的CSS样式编辑工具4.3 教学步骤1. 介绍CSS样式的基本概念2. 演示CSS样式的使用方法3. 讲解Dreamweaver的CSS样式编辑工具4. 学生练习编辑CSS样式4.4 作业与练习编辑CSS样式制作一个简单的网页熟悉Dreamweaver的CSS样式编辑工具第五章：网页交互与动画5.1 课程目标学习网页交互的基本概念掌握网页交互的方法熟悉Dreamweaver的交互工具5.2 教学内容网页交互的基本概念网页交互的方法Dreamweaver的交互工具5.3 教学步骤1. 介绍网页交互的基本概念2. 演示网页交互的方法3. 讲解Dreamweaver的交互工具4. 学生练习网页交互和动画制作5.4 作业与练习制作一个带有交互和动画的网页熟悉Dreamweaver的交互工具第六章：网页素材与图像处理6.1 课程目标学习网页素材的基本概念掌握图像处理的方法熟悉Dreamweaver的图像插入和编辑工具6.2 教学内容网页素材的基本概念图像处理的方法Dreamweaver的图像插入和编辑工具6.3 教学步骤1. 介绍网页素材的基本概念2. 演示图像处理的方法3. 讲解Dreamweaver的图像插入和编辑工具4. 学生练习插入和编辑图像6.4 作业与练习插入和编辑图像制作一个简单的网页熟悉Dreamweaver的图像插入和编辑工具第七章：网页与导航7.1 课程目标学习网页的基本概念掌握网页的方法熟悉Dreamweaver的插入和管理工具7.2 教学内容网页的基本概念网页的方法Dreamweaver的插入和管理工具7.3 教学步骤1. 介绍网页的基本概念2. 演示网页的方法3. 讲解Dreamweaver的插入和管理工具4. 学生练习插入和管理7.4 作业与练习插入和管理制作一个简单的网页导航熟悉Dreamweaver的插入和管理工具第八章：表格与数据管理8.1 课程目标学习表格的基本概念掌握表格的制作和编辑方法熟悉Dreamweaver的表格工具8.2 教学内容表格的基本概念表格的制作和编辑方法Dreamweaver的表格工具8.3 教学步骤1. 介绍表格的基本概念2. 演示表格的制作和编辑方法3. 讲解Dreamweaver的表格工具4. 学生练习制作和编辑表格8.4 作业与练习制作和编辑表格展示一组数据熟悉Dreamweaver的表格工具第九章：表单与数据验证9.1 课程目标学习表单的基本概念掌握表单的制作和数据验证方法熟悉Dreamweaver的表单工具9.2 教学内容表单的基本概念表单的制作和数据验证方法Dreamweaver的表单工具9.3 教学步骤1. 介绍表单的基本概念2. 演示表单的制作和数据验证方法3. 讲解Dreamweaver的表单工具4. 学生练习制作和数据验证表单9.4 作业与练习制作和数据验证一个简单的表单熟悉Dreamweaver的表单工具第十章：网站发布与维护10.1 课程目标学习网站发布的基本概念掌握网站发布的步骤熟悉Dreamweaver的网站发布和管理工具10.2 教学内容网站发布的基本概念网站发布的步骤Dreamweaver的网站发布和管理工具10.3 教学步骤1. 介绍网站发布的基本概念2. 演示网站发布的步骤3. 讲解Dreamweaver的网站发布和管理工具4. 学生练习发布和管理网站10.4 作业与练习发布和管理一个简单的网站熟悉Dreamweaver的网站发布和管理工具重点和难点解析一、Dreamweaver概述重点和难点解析：Dreamweaver的工作界面和基本操作是初次接触该软件的学生必须要掌握的基础。

国家开放大学《Dreamweaver网页设计》章节自测题参考答案第1章Dreamweaver软件基础一、单选题1.下面关于网站策划的说法错误的是：A. 信息的种类与多少会影响网站的表现力B. 做网站的第一步就是确定主题C. 对于网站策划来说最重要的还是网站的整体风格D. 向来总是内容决定形式的2.下面关于素材准备的说法错误的是：A. 网站徽标的设计对于制作网站来说比较重要B. 在Dreamweaver中自带有准备素材的功能C. 是网站制作中的重要一环D. Adobe公司的Fireworks可以和Dreamweaver很好的结合使用第2章网页基本元素的添加一、单选题1.下列哪个是“图像占位符”的属性A. 名称(Name)B. 位置(Location)C. 可见性(Visibility)D. z轴（z-index）2.如果要使图像在缩放时不失真，在图像显示原始大小时，按下（）键，拖动图像右下方的控制点，可以按比例调整图像大小A. CtrlB. Shift+AltC. ShiftD. Alt3.从Dreamweaver 中直接使用Fireworks 来优化图像，不能实现的操作是A. 增加特殊显示效果B. 更换图像文件格式C. 优化到指定文件大小D. 调整图像尺寸大小二、多选题4.在Dreamweaver中将文本添加到文档的方法有A. 直接在Dreamweaver 中打开文本文件B. 导入Microsoft Word 内容C. 从现有的文本文档中拷贝和粘贴D. 直接在文档窗口键入文本5.在表格单元格中可以插入的对象有A. 文本B. Java程序插件C. Flash动画D. 图像6.GIF图像的优点有A. 支持24位真彩色B. 无损方式压缩C. 支持透明背景D. 它支持动画格式三、简答题7.除了普通文本，还可以在页面中插入哪些和文本相关的元素？参考答案：可以插入日期时间、列表、水平线、滚动文字等。

8.怎么设置滚动文字的不同效果？参考答案：通过<marquee>标签的Behavior属性能够设置不同方式的滚动文字效果，如滚动的循环往复、交替滚动、单次滚动等。

《网页设计课后复习题》第一章网页设计概述一、填空题。

1.HTML是超文本标记语言的英文缩写，全称是Hyper Text Markup Language。

2.现在网络上使用的绝大多数图片和图像是gif格式、jpeg格式和png文件格式。

3.通过超链接可以从一个网页转到另一个网页，也可以从一个网页转到另一个网页。

超链接的载体包括文本、图像和热区三种。

4.网页能够把信息以多媒体的方式表现出来，同时把世界各地的信息链接在一起。

网页的基本功能有媒体的作用、互动的作用和传输的作用三方面。

5.PNG格式是Fireworks默认的格式。

它结合了jpeg和gif的优点，也支持透明和交错，是无损压缩的。

二、选择题。

1.网页中最基本的元素是（D）。

D.文字。

2.浏览网页时，当鼠标指针指向超链接时，通常鼠标指针的形状会变成（A）。

A.手形。

3.下列（D）不是用于制作网页的软件。

D.ORC。

4.以下图像格式具有动画效果的是（B）。

B.GIF。

5.网页编制完成以后，一般是以(C)为扩展名存盘的。

C.html。

第二章HTML语言基础一、填空题。

1.在HTML语言中文本文档标签是必须的。

2.在HTML语言中<P>标记的作用是表示一个文本段落的开始。

3.在插入图像或者使用超链接时，路径有相对路径和绝对路径两种。

4.HTML的英文全称是Hypertext Markup Language。

5.HTML列表常用的包括有序列表和无序列表，有序列表的标记是<OL>，无序列表的标记是<UL>。

二、选择题。

1.为同段落中的文本换行时，HTML标记为（B）。

B.<br>。

2.HTML代码<img src=url>表示（A）。

A.添加一个图像。

3.在HTML文档中创建最大的标题的文本标签是（B）。

B.<hL></hL>。

4.在HTML文档中网页的主体内容将写在（A）标记内。

使用Dreamweaver进行网页设计Dreamweaver是一款功能强大的网页设计工具，它为用户提供了一种快速、高效的方式来创建和编辑网页。

无论是初学者还是专业人士，都可以利用Dreamweaver轻松地设计出令人印象深刻的网页。

本文将介绍使用Dreamweaver进行网页设计的一些基本知识和技巧。

首先，让我们来了解一下Dreamweaver的界面。

Dreamweaver采用了分栏式的操作界面，左侧是资源管理器，用于管理网页中使用到的图片、脚本和样式表等文件。

右侧是代码编辑区域，用于编写和编辑网页的HTML、CSS和JavaScript代码。

中间是设计视图，可以实时预览网页的外观和布局。

在开始设计网页之前，我们需要明确网页的整体结构和布局。

Dreamweaver提供了多种布局模板和网页结构示例，可以在创建新网页时选择适合自己需求的模板，或者自定义设计网页的结构。

通过拖拽和调整不同的组件，如导航栏、页头、页脚等，我们可以很容易地创建一个符合用户期望的网页布局。

网页设计的重要一环是选择合适的颜色和字体。

Dreamweaver内置了各种颜色和字体样式的选择器，用户可以根据自己的喜好和需求来定制网页的配色方案和字体样式。

此外，Dreamweaver还支持从Adobe库中导入其他专业设计师创建的颜色和字体样式，帮助用户快速地实现专业级的网页设计效果。

在设计网页的过程中，我们还需要考虑网页的响应式布局。

Dreamweaver提供了响应式网页设计工具，可以根据设备的屏幕尺寸和方向来调整网页的布局和元素大小。

这使得用户无需手动编写复杂的媒体查询代码，就能轻松实现网页在不同设备上的自适应布局。

除了设计网页的外观，我们还可以通过Dreamweaver实现一些交互功能。

通过拖拽和配置各种交互组件，如按钮、表单和轮播图等，我们可以为网页添加按钮点击事件、表单提交处理和图片轮播等功能。

这使得网页不仅仅是一个静态展示的页面，而是能够与用户进行互动和反馈的工具。

手把手教你使用AdobeDreamweaver进行网页设计Adobe Dreamweaver是一款专业的网页设计软件，具有强大的功能和易于使用的界面，方便用户进行网页设计和开发。

本文将手把手教你使用Adobe Dreamweaver进行网页设计，分为以下几个章节。

第一章：介绍Adobe DreamweaverAdobe Dreamweaver是一款由美国软件公司Adobe Systems开发的网页设计工具。

它集成了可视化设计和代码编辑功能，可以帮助设计师和开发人员快速创建和编辑网页。

与其他网页设计工具相比，AdobeDreamweaver具有更多的高级功能，适用于一些复杂的网页设计和开发需求。

第二章：Dreamweaver的安装与设置首先，我们需要从Adobe官方网站下载Adobe Dreamweaver安装程序。

安装程序下载完成后，双击运行安装程序，按照提示完成安装。

安装完成后，打开Adobe Dreamweaver，选择界面语言和一些个性化设置，然后进入软件主界面。

第三章：网页设计基础在使用Adobe Dreamweaver进行网页设计之前，我们需要了解一些基础概念和技术。

首先是HTML（Hypertext Markup Language）和CSS（Cascading Style Sheets），它们是网页设计中最基本也是最重要的两个技术。

HTML用于定义网页的结构和内容，而CSS用于定义网页的样式和布局。

掌握了这两个技术，我们才能更好地使用AdobeDreamweaver进行网页设计。

第四章：创建网页在Adobe Dreamweaver中，我们可以通过两种方式创建网页。

第一种是使用可视化设计界面，拖拽元素进行网页设计。

第二种是通过手动编写HTML和CSS代码来创建网页。

根据自己的需求和熟练程度，选择一种合适的方式进行网页设计。

第五章：编辑网页内容在网页设计过程中，经常需要对网页内容进行编辑。

使用Dreamweaver进行网页设计的步骤第一章：了解Dreamweaver及其功能-----------------------Dreamweaver是一款强大的网页设计软件，它集成了图形化和代码编辑功能，可以帮助开发人员快速创建专业的网页。

在开始使用Dreamweaver之前，首先需要了解它的主要功能和特点，包括WYSIWYG编辑模式、代码编辑器、网页布局工具和可视化CSS样式编辑器等。

通过熟悉这些功能，我们能更好地利用Dreamweaver进行网页设计。

第二章：创建新的网站-----------------在Dreamweaver中进行网页设计之前，我们需要先创建一个新的网站。

点击菜单栏的“文件”选项，选择“新建”，然后在对话框中选择“网站”选项。

在网站设置中，我们需要填写网站的名称、本地路径和远程服务器信息（如果需要）。

创建完网站后，Dreamweaver会在软件的资源管理器中为项目创建一个文件夹，方便我们整理和管理网页文件。

第三章：设计网页布局-----------------在Dreamweaver中设计网页布局是整个网页设计过程中的关键步骤。

我们可以通过拖拽元素、使用网格布局和使用CSS布局等方式来快速构建网页的基本结构。

拖拽元素是指通过在Dreamweaver的资源管理器中选择需要的元素，然后将其拖拽到页面上。

网格布局是通过在页面上划分一个或多个网格，并将元素放置在网格中来实现的。

而CSS布局则是通过编写CSS样式来实现网页结构的定义。

第四章：编辑网页内容-----------------在Dreamweaver中编辑网页内容是非常简单的。

可以通过视图模式切换到所见即所得编辑模式，这样能够直接在页面上进行编辑。

也可以切换到代码编辑器模式，通过编写HTML和CSS代码来修改网页内容。

此外，在Dreamweaver中还可以使用预设模板和动态网页功能，加快网页内容的编辑和更新。

第五章：添加交互元素------------------网页设计中的交互元素，如按钮、表单和轮播图等，能够增强用户体验并丰富网页功能。

Dreamweaver网页制作教案第一章：Dreamweaver概述1.1 课程介绍了解Dreamweaver作为网页制作工具的优势熟悉Dreamweaver的工作界面1.2 创建和管理网页创建新文档打开和保存网页管理标签库1.3 实践操作制作一个简单的网页学会使用Dreamweaver的实时视图和代码视图第二章：网页基本结构2.1 网页元素文本图像表格表单2.2 排版和格式化字体和大小颜色和样式段落对齐和间距2.3 实践操作制作一个包含文本、图像和的网页学习使用Dreamweaver的排版和格式化工具第三章：CSS样式3.1 CSS介绍了解CSS的作用和优势熟悉CSS的基本语法3.2 创建和应用CSS样式创建样式表应用样式到网页元素编辑和删除样式3.3 实践操作制作一个使用CSS样式的网页学习使用Dreamweaver的CSS面板第四章：网页布局4.1 布局技术表格布局CSS布局框架布局4.2 常用布局方法固定布局可变布局响应式布局4.3 实践操作制作一个使用表格布局的网页学习使用CSS布局和响应式布局第五章：表单和交互5.1 表单元素表单标签输入框选择框文件5.2 验证和提交表单表单验证方法提交表单到服务器接收服务器返回的数据5.3 实践操作制作一个简单的表单页面学习表单的验证和交互功能第六章：Dreamweaver 网站管理6.1 网站结构规划了解网站结构的重要性学习如何规划网站结构熟悉网站的目录和文件组织方式6.2 站点设置和管理创建和定义站点管理站点文件和目录更新和网站文件6.3 实践操作规划并创建一个简单的网站结构配置和管理Dreamweaver 站点第七章：Dreamweaver 模板和框架7.1 模板的概念和应用理解模板的作用学习如何创建和使用模板掌握模板的插入点和使用技巧7.2 框架和框架集了解框架和框架集的概念学习如何创建和编辑框架掌握框架的布局和内容管理7.3 实践操作创建一个简单的模板文件使用模板创建网站的多个页面制作一个使用框架的网页布局第八章：Dreamweaver 动画和多媒体8.1 动画技术概述了解Dreamweaver 支持的视频和动画格式学习如何插入和编辑动画元素8.2 多媒体元素的应用插入图像、音频和视频设置多媒体属性和行为掌握交互式多媒体元素的制作8.3 实践操作制作一个包含动画和多媒体元素的网页学习使用Dreamweaver 的行为面板为网页添加交互功能第九章：Dreamweaver 网页编程9.1 行为和事件理解行为和事件的概念学习如何使用行为为网页添加功能掌握常见行为的使用方法9.2 JavaScript 基础了解JavaScript 的基本概念学习如何在Dreamweaver 中编写JavaScript 代码掌握Dreamweaver 的JavaScript 调试工具9.3 实践操作编写简单的JavaScript 代码为网页添加功能学习使用Dreamweaver 的JavaScript 面板和调试工具第十章：Dreamweaver 网站发布和维护10.1 网站测试学习网站在不同浏览器和设备上的测试方法掌握网站性能测试和优化技巧10.2 网站发布了解网站发布的流程和注意事项学习如何使用Dreamweaver 发布网站10.3 网站维护和更新学习网站的日常维护和更新技巧掌握网站安全和备份方法10.4 实践操作对一个网站进行全面的测试和优化发布和维护一个简单的网站第十一章：Dreamweaver 数据库和动态内容11.1 数据库基础了解数据库的概念和作用学习如何连接和操作不同类型的数据库11.2 动态内容创建学习如何创建动态网页和表单掌握Dreamweaver 内置的服务器模型和数据源11.3 实践操作连接一个数据库并创建一个动态表单使用Dreamweaver 插入动态内容到网页第十二章：Dreamweaver 扩展性和高级技巧12.1 扩展Dreamweaver学习如何安装和使用Dreamweaver 插件和扩展掌握Dreamweaver 扩展的创建和分享12.2 高级网页技术学习如何使用CSS3 和HTML5掌握响应式设计和移动网页制作技巧12.3 实践操作制作一个使用CSS3 和HTML5 的网页创建一个响应式设计的网页layout第十三章：Dreamweaver 与其他工具的集成13.1 图像和图形编辑工具学习如何使用Adobe Photoshop 和Fireworks 与Dreamweaver 协同工作掌握图像和图形的导入和编辑技巧13.2 代码编辑和调试工具学习如何使用Dreamweaver 的代码编辑功能掌握使用外部代码编辑器和调试工具的技巧13.3 实践操作使用Photoshop 和Fireworks 制作网页素材在Dreamweaver 中导入和应用图像和图形第十四章：Dreamweaver 项目管理和团队协作14.1 项目管理学习如何管理Dreamweaver 项目文件和资源掌握Dreamweaver 项目的备份和版本控制14.2 团队协作了解团队协作的重要性学习如何在团队中使用Dreamweaver 和版本控制系统14.3 实践操作管理一个Dreamweaver 项目并实现版本控制在团队中使用Dreamweaver 进行协作第十五章：Dreamweaver 综合实战项目15.1 项目规划和设计学习如何进行项目规划和设计熟悉项目的时间管理和资源分配15.2 项目实施学习如何实施Dreamweaver 项目掌握项目的时间管理和问题解决技巧15.3 项目评估和优化学习如何评估Dreamweaver 项目的效果掌握项目的优化和维护技巧15.4 实践操作完成一个Dreamweaver 综合实战项目进行项目评估和优化以提高网站质量和性能重点和难点解析重点：Dreamweaver的工作界面和基本操作网页基本结构元素的插入和编辑CSS样式的创建和应用网页布局技术，包括表格布局、CSS布局和响应式布局表单的创建和交互功能的实现网站的管理和站点的设置模板和框架的使用动画和多媒体元素的插入网页编程，包括行为和事件的应用、JavaScript基础网站的测试、发布和维护数据库连接和动态内容的创建扩展性和高级技巧的运用与其他工具的集成和项目管理的实践团队协作和综合实战项目的实施难点：CSS样式的复杂应用和调试网页布局的高级技巧，如响应式布局的实现表单验证和交互逻辑的编写网站管理和站点配置的细节处理模板和框架的精细操作JavaScript代码的编写和调试数据库连接和动态内容的管理扩展性和高级技巧的深入应用团队协作和项目管理的策略制定综合实战项目的规划和实施通过理解和掌握这些重点和难点，学生将能够熟练使用Dreamweaver进行网页制作，并能够应对真实世界的网页设计挑战。

《网页设计与制作》课程标准《网页设计与制作》课程标准前言：《网页设计与制作》是理实一体化课程，是计算机专业（软件与信息服务、数字媒体、计算机应用专业）的一门重要的专业必修课。

本课程定位于WEB技术开发工作岗位。

它是WEB前端技术开发的必备课程，在整个课程体系中具有重要的作用，一、课程的说明：通过本课程的学习，使学生了解网页设计技术的起源和发展、常用的网页制作软件及HTML语言，掌握运用Dreamweaver（以下简称DW）网页制作软件制作网页的方法，通过运用Photoshop图像处理软件和Flash动画制作软件，三个软件互相配合，完成网页设计与制作任务的方法。

为今后从事网页设计与制作、网站开发和管理奠定基础。

在网页设计的实践中重点培养团队协作、沟通交流能力，培养自主学习能力和探索创新能力。

二、课程内容与基本要求：该课程涉及的知识是网页设计人员必备的基本技能，职业活动与课程内容的对应关系如下：网页设计开发岗位职业能力教学内容（理实一体化课）基本开发工具的使用网页基本概念（第1章）DW CS6软件介绍（第2章）建立与管理站点（第3章）网页基本元素的处理制作主要内容为文本的网页（第4章）插入与编辑图像（第5章）插入多媒体元素（第6章）创建超级链接（第7章）HTML基础（第13章）网页布局表格处理与网页布局（第6章）AP Div的应用（第9章）使用CSS+DIV布局网页（第11章）网页美化CSS样式表（第10章）网页交互行为（第12章）动态网页基础（第15章）网页及元素的复用创建和使用模板（第9章）创建和使用库（第10章）网页与网站基本概念、网页基本组成元素、常用网页制作软件主要教学内容：1.1 网页制作基础知识1.2 网页的基本构成元素1.3 网页制作常用软件和技术第二章Dreamweaver CS6轻松入门（2学时）教学目标：DW CS6软件的安装、用DW建立网页的方法、打开和保存网页的方法主要教学内容：2.1 Dreamweaver CS6工作环境2.2 [插入]栏2.3 Dreamweaver CS6新功能第三章站点的搭建与管理（4学时）教学目标：本地站点与远程站点的概念、站点文件夹的管理主要教学内容：3.1 创建本地站点3.2 管理点站3.3 管理站点中的文件4.3 使用站点地图第四章网站建设规范和基本流程（2学时）教学目标：IIS信息服务器的搭建与管理、建立、发布主页、建立和管理站点主要教学内容：4.1 网站建设规范4.2 网站建设的基本流程第五章创建结构清晰的文本网页（6学时）教学目标：1. 在网页中添加文字和字符2. 使用背景、列表美化文本网页主要教学内容：5.1 设置文本属性5.2 插入其他元素5.3 创建项目列表和编号列表5.4 插入网页头部内容5.5 综合案例-创建基本文本网页第六章创建绚丽多彩的图像和多媒体网页（6学时）教学目标：1. 了解网页中常用的图像格式2. 网页中插入图像的方法3. 网页中插入多媒体的方法主要教学内容：6.1 网页中常用的图像格式6.2 编辑图像6.3 插入多媒体6.4 综合案例-创建图文混排网页第七章创建超级链接（6学时）教学目标：超级链接的概念、文字与网页间的链接、图片热点和锚记主要教学内容：7.1 超级链接的基本概念7.2 创建超级链接的方法7.3 创建各种类型的链接7.4 管理超链接7.5 综合实例第八章使用表格排版网页（6学时）教学目标：1. 表格的编辑处理2. 用表格制作网页元素主要教学内容：8.1 创建表格8.2 设置表格及其元素属性8.3 表格的基础操作8.4 表格的基本应用8.5 综合实例-利用表格排版网页第九章使用DIV和Spry灵活布局网页（4学时）教学目标：1. AP Div的创建2. 在AP Div中插入网页元素3. 设置AP Div的属性主要教学内容：9.1 插入AP Div9.2 设置AP Div属性9.3 使用Spry布局对象第十章使用CSS修饰美化网页（6学时）教学目标：1、CSS样式表的类型2、CSS样式表的创建3、不同样式表的样式应用主要教学内容：10.1 CSS简介10.2 使用CSS10.3 设置CSS样式10.4 CSS滤镜设计特效文字10.5 综合实例第11章CSS+DIV布局方法（6学时）教学目标：盒子模型概念、CSS布局理念、常见布局类型主要教学内容：11.1 初识DIV11.2 CSS定位11.3 CSS布局理念11.4 常见的布局类型第12章使用模板和库提高网页制作效率（6学）教学目标：了解模型的库的概念，会使用库创建项目主要教学内容：12.1 创建模板12.2 使用模板12.3 管理模板12.4 创建和应用库项目第13章使用行为和动作为网页添加活力（6学时）教学目标：重点区分行为、触发事件、动作、对象等概念和区别主要教学内容：13.1 行为的概念13.2 行为的动作和事件13.3 使用Dreamweaver内置行为第14章网站页面布局设计与色彩搭配（2学时）教学目标：网页色彩搭配知识、常见页面版式主要教学内容：14.1 网页版面布局设计14.2 常见版面布局形式14.3 网页色彩搭配知识第15章用表单创建交互式网页（6学时）教学目标：表单的基本概念、常用表单元素的插入方法主要教学内容：15.1 表单概述15.2 创建表单域15.3 插入文本域15.4 复选框和单选按钮15.5 列表和菜单15.6 跳转菜单的使用15.7 使用按钮激活表单15.8 使用隐藏域和文件域15.9 综合案例五、课程实施条件本课程需要一间高性能联网的计算机实训室，需满足每位学生一台电脑。

网页设计Dreamweaver教案第一章：Dreamweaver简介1.1 课程目标了解Dreamweaver的发展历程和版本更新掌握Dreamweaver的基本功能和操作界面熟悉Dreamweaver在网页设计中的应用场景1.2 教学内容Dreamweaver的起源和发展历程Dreamweaver的版本更新及特点Dreamweaver的操作界面及功能介绍Dreamweaver在网页设计中的应用案例1.3 教学方法讲授与示范相结合，让学生了解Dreamweaver的发展历程和版本更新实践操作，让学生掌握Dreamweaver的基本功能和操作界面案例分析，让学生熟悉Dreamweaver在网页设计中的应用场景1.4 教学资源PowerPoint课件Dreamweaver软件网页设计案例1.5 教学评估课后作业：让学生制作一个简单的网页，巩固所学内容课堂讨论：引导学生分享自己在网页设计中使用Dreamweaver的经验和心得第二章：创建和管理网页2.1 课程目标掌握Dreamweaver的网页创建和管理功能熟悉网页编辑区的基本操作了解网页、描述和关键词的设置方法2.2 教学内容Dreamweaver的网页创建和管理功能介绍网页编辑区的基本操作网页、描述和关键词的设置方法2.3 教学方法讲授与示范相结合，让学生掌握Dreamweaver的网页创建和管理功能实践操作，让学生熟悉网页编辑区的基本操作案例演示，让学生了解网页、描述和关键词的设置方法2.4 教学资源PowerPoint课件Dreamweaver软件网页设计案例2.5 教学评估课后作业：让学生创建一个简单的网页，并设置网页、描述和关键词课堂讨论：引导学生分享自己在网页设计中关于网页、描述和关键词设置的经验和心得第三章：编辑和排版文本3.1 课程目标掌握Dreamweaver中文本的编辑和排版功能熟悉字体、颜色、大小和样式的设置方法了解文本对齐、行间距和段落格式的设置方法3.2 教学内容Dreamweaver中文本的编辑和排版功能介绍字体、颜色、大小和样式的设置方法文本对齐、行间距和段落格式的设置方法3.3 教学方法讲授与示范相结合，让学生掌握Dreamweaver中文本的编辑和排版功能实践操作，让学生熟悉字体、颜色、大小和样式的设置方法案例演示，让学生了解文本对齐、行间距和段落格式的设置方法3.4 教学资源PowerPoint课件Dreamweaver软件网页设计案例3.5 教学评估课后作业：让学生编辑和排版一个文本内容丰富的网页课堂讨论：引导学生分享自己在网页设计中关于文本编辑和排版的经验和心得第四章：添加图像和媒体元素4.1 课程目标掌握Dreamweaver中图像和媒体元素的操作功能熟悉图像和媒体元素的插入、编辑和格式设置方法了解图像和媒体元素在网页设计中的应用场景4.2 教学内容Dreamweaver中图像和媒体元素的操作功能介绍图像和媒体元素的插入、编辑和格式设置方法图像和媒体元素在网页设计中的应用场景4.3 教学方法讲授与示范相结合，让学生掌握Dreamweaver中图像和媒体元素的操作功能实践操作，让学生熟悉图像和媒体元素的插入、编辑和格式设置方法案例分析，让学生了解图像和媒体元素在网页设计中的应用场景4.4 教学资源PowerPoint课件Dreamweaver软件网页设计案例4.5 教学评估课后作业：让学生添加图像和媒体元素到一个网页中，提升网页视觉效果课堂讨论：引导学生分享自己在网页设计中关于图像和媒体元素应用的经验和心得第五章：创建和应用超5.1 课程目标掌握Dreamweaver中超的创建和应用功能熟悉超的类型和创建方法了解超的目标设置和命名规则5.2 教学内容-第六章：表格和布局6.1 课程目标掌握Dreamweaver中表格的创建和编辑功能熟悉表格的布局和样式设置方法了解表格在网页设计中的应用场景6.2 教学内容Dreamweaver中表格的创建和编辑功能介绍表格的布局和样式设置方法表格在网页设计中的应用场景6.3 教学方法讲授与示范相结合，让学生掌握Dreamweaver中表格的创建和编辑功能实践操作，让学生熟悉表格的布局和样式设置方法案例分析，让学生了解表格在网页设计中的应用场景6.4 教学资源PowerPoint课件Dreamweaver软件网页设计案例6.5 教学评估课后作业：让学生创建一个表格布局的网页，展示信息列表课堂讨论：引导学生分享自己在网页设计中关于表格布局的经验和心得第七章：表单和动画7.1 课程目标掌握Dreamweaver中表单的创建和编辑功能熟悉表单元素和属性的设置方法了解动画在网页设计中的应用场景和创建方法7.2 教学内容Dreamweaver中表单的创建和编辑功能介绍表单元素和属性的设置方法动画在网页设计中的应用场景和创建方法7.3 教学方法讲授与示范相结合，让学生掌握Dreamweaver中表单的创建和编辑功能实践操作，让学生熟悉表单元素和属性的设置方法案例分析，让学生了解动画在网页设计中的应用场景和创建方法7.4 教学资源PowerPoint课件Dreamweaver软件网页设计案例7.5 教学评估课后作业：让学生创建一个包含表单和动画的网页，实现用户互动课堂讨论：引导学生分享自己在网页设计中关于表单和动画应用的经验和心得第八章：CSS样式和模板8.1 课程目标掌握Dreamweaver中CSS样式的创建和应用功能熟悉CSS选择器和属性的设置方法了解模板在网页设计中的应用场景和创建方法8.2 教学内容Dreamweaver中CSS样式的创建和应用功能介绍CSS选择器和属性的设置方法模板在网页设计中的应用场景和创建方法8.3 教学方法讲授与示范相结合，让学生掌握Dreamweaver中CSS样式的创建和应用功能实践操作，让学生熟悉CSS选择器和属性的设置方法案例分析，让学生了解模板在网页设计中的应用场景和创建方法8.4 教学资源PowerPoint课件Dreamweaver软件网页设计案例8.5 教学评估课后作业：让学生创建一个CSS样式和模板应用的网页，提升网页美观度课堂讨论：引导学生分享自己在网页设计中关于CSS样式和模板应用的经验和心得第九章：网站发布和管理9.1 课程目标掌握Dreamweaver中网站的发布和管理功能熟悉FTP协议和网站方法了解网站维护和优化的基本方法9.2 教学内容Dreamweaver中网站的发布和管理功能介绍FTP协议和网站方法网站维护和优化的基本方法9.3 教学方法讲授与示范相结合，让学生掌握Dreamweaver中网站的发布和管理功能实践操作，让学生熟悉FTP协议和网站方法案例分析，让学生了解网站维护和优化的基本方法9.4 教学资源PowerPoint课件Dreamweaver软件网页设计案例9.5 教学评估课后作业：让学生将所学网页发布到服务器，进行实际操作课堂讨论：引导学生分享自己在网站发布和管理中的经验和心得第十章：网页设计案例分析10.1 课程目标分析实际网页设计案例了解网页设计中的创新点和不足之处提高学生网页设计的能力和审美水平10.2 教学内容分析实际网页设计案例讨论网页设计中的创新点和不足之处提高学生网页设计的能力和审美水平10.3 教学方法讲授与示范相结合，让学生分析实际网页重点和难点解析1. 章节一和二：Dreamweaver简介和创建与管理网页重点解析：理解Dreamweaver的历史和发展，熟悉其操作界面和基本功能，以及如何有效地创建和管理网页。

《网页设计与制作》教学大纲第一部分大纲说明一、课程的性质和任务：《网页设计与制作》是一门操作性和实践性很强的课程,为网络专业和计算机相关专业的必修课。

本课程的主要内容包括了网页编辑与制作软件Dreamweaver MX建站的全过程。

教材体现网页制作技术的的特点，注重实用性和操作性,综合讲述了网页制作中的网页编辑、Web图像制作以及网页中动画设计的基本概念和基本操作技能。

书中文字叙述简单明了、通俗易懂。

按照Macromidia公司出品的网页制作系列软件的系统内容，由浅入深、循序渐进，符合学习者的认知规律。

书中列举了部分实例，各章都编排了适量的习题、思考题，以使学生更好地理解和掌握书中所讲述的内容。

二、培养目标：结业后能独立完成公司或个人主页的制作、维护、站点管理、设计制作精美的网页，能够更好地把企业通过互联网推向全球，并通过考试可获得网页设计师相关证书。

三、授课对象：高职高专类网络专业和计算机相关专业四、课程的特点和教学基本要求课程在重点介绍网页设计软件Dreamweaver MX的操作与应用的基础上，通过大量实例和光盘教学素材，详细地阐述了网页设计软件的应用技巧，使学生在学习过程中得以融会贯通，掌握网页设计软件的高级应用。

同时，授课过程中将始终遵循“用户界面感受第一”的基本原则，教导学生在策划、设计过程中设身处地为用户着想，让创意为用户服务，培养学生独立思考、独立创作的良好学习习惯，为学生成为一名优秀的网页设计师打下坚实的基础。

课程设置的根本思路是为使学生能够最大程度满足企业对于网页设计人员的需求，达到学以致用的目的，从而为企业培养优秀的网页设计实用人才。

五、课程教学要求的层次1、掌握：在网页文档中添加文本和文本的格式化方法、插入日期和时间、插入水平线、设置网页的属性等操作方法。

在Dreamweaver MX中使用的图像格式、在网页文档中插入图像、为页面背景添加图像、图像属性的设置、图像与文本的混合排版、设置图像的位置和边框、设置图像的缩略图的操作方法，会使用图像编辑器，会在网页中插入翻转图像和导航条的操作、表格的组成和基本操作方法及创建表格、表格操作、表格编辑的方法、表格和单元格的属性设置，会用表格组织网页的总体布局，掌握使用布局视图布局页面的总体布局。