第1章 网页设计与制作基础 1

1.1 学习任务：认识网页 1

1.1.1 什么是网页 1

1.1.2 网页类型 2

1.1.3 网页基本元素 3

1.1.4 网页制作常用软件和技术 5

1.2 学习任务：认识网站 7

1.2.1 什么是网站 7

1.2.2 网址与域名 7

1.2.3 网站建设的一般流程 8

1.3 学习任务：HTML基础知识 11

1.3.1 HTML简介 11

1.3.2 HTML的基本语法与结构 12

1.3.3 常用的HTML标签 14

1.3.4 HTML5.0标签及属性 25

1.4 实训 28

1.4.1 实训一 使用记事本编辑

简单的网页 28

1.4.2 实训二 制作滚动图片

链接 28

1.5 习题 29

第2章 网页版式设计与色彩搭配 32

2.1 案例分析：不同风格网页作品

欣赏与解析 32

2.2 学习任务：网页版式设计 34

2.2.1 版式设计概述 35

2.2.2 网页版式的尺寸和构成

要素 35

2.2.3 网页的版式设计风格 36

2.2.4 网页版式设计原则 38

2.2.5 网页版式设计的视觉流程 38

2.2.6 网页版式设计的步骤 38

2.3 学习任务：色彩的基本理论及

其视觉效果 39

2.3.1 色彩的基本理论 39

2.3.2 色彩的视觉效果 40

2.4 学习任务：网页中的色彩及配色 41

2.4.1 网页色彩 42

2.4.2 网页中色彩的作用 42

2.4.3 网页配色原理 42

2.4.4 网页配色技巧 43

2.5 实训 44

2.5.1 实训一 总结不同主题网站的版

式设计及配色 44

2.5.2 实训二 网页配色练习 44

2.5.3 实训三 校友网首页效果图

设计 45

2.6 习题 46

第3章 Dreamweaver CS6入门 47

3.1 学习任务：认识中文版

Dreamweaver CS6 47

3.1.1 Dreamweaver CS6的特点 47

3.1.2 Dreamweaver CS6的新增

功能 48

3.1.3 Dreamweaver CS6的安装

与卸载 49

3.2 学习任务：Dreamweaver CS6

工作区介绍 51

3.2.1 启动Dreamweaver CS6 51

3.2.2 Dreamweaver CS6工作区布局

介绍 52

3.3 学习任务：规划与创建站点 57

3.3.1 站点概述 57

3.3.2 规划站点 56

3.3.3 创建本地站点 57

3.3.4 管理站点 59

3.4 案例：创建欢迎光临网页 60

3.4.1 创建网页文档 60

3.4.2 设置页面属性 62

3.4.3 保存网页文档 66

3.4.4 预览网页文档 67

3.5 实训：制作网上家园欢迎页面 68

3.6 习题 69

第4章 CSS样式基础 70

4.1 学习任务：CSS概述 70

4.1.1 CSS的基本概念 70

4.1.2 使用HTML和CSS格式

化网页 71

4.1.3 CSS样式面板 72

4.1.4 CSS基本语法 73

4.1.5 CSS样式表的引用 74

4.2 学习任务：CSS样式的创建与

属性设置 77

4.2.1 创建CSS样式 77

4.2.2 设置CSS属性 78

4.2.3 使用CSS样式面板设置

CSS属性 85

4.3 学习任务：管理CSS样式 85

4.3.1 链接或导入外部CSS样式 86

4.3.2 查看CSS样式 87

4.3.3 编辑与删除CSS样式 87

4.4 案例：使用CSS样式美化网页 88

4.5 实训 91

4.5.1 实训一 为网页元素应用

CSS样式 91

4.5.2 实训二 新浪新闻头条 91

4.6 习题 92

第5章 网页的文本和图像 94

5.1 案例1：设计唐诗赏析网页 94

5.1.1 在网页中添加文本 95

5.1.2 设置项目符号或编号 97

5.1.3 插入特殊字符、水平线

和日期 98

5.1.4 设置文本属性 100

5.1.5 使用CSS设置段落样式 103

5.2 学习任务：网页图像 104

5.2.1 网页中常用的图像格式 105

5.2.2 在网页中添加图像 105

5.2.3 设置网页图像属性 106

5.2.4 用CSS设置网页图像

样式 107

5.2.5 用CSS设置网页的背景

图像 109

5.2.6 插入图像占位符和鼠标

经过图像 110

5.3 案例2：图文混排——设计电影介绍

网站页面 112

5.4 实训：设计畅销书介绍网页 113

5.5 习题 114

第6章 网页超链接与导航 116

6.1 案例1：设计制作过节乐网页 116

6.1.1 超链接概述 117

6.1.2 创建各类超链接 118

6.1.3 用CSS设置超链接样式 122

6.2 案例2：图像地图——设计国家地理

网站页面 123

6.3 学习任务：网页导航设计 125

6.3.1 网页导航概述 125

6.3.2 网页导航分类 126

6.3.3 网页导航方向 128

6.4 案例3：设计制作网页导航 129

6.5 实训：设计制作点点星空

网站页面 131

6.6 习题 132

第7章 使用表格布局网页 134

7.1 案例1：设计学生成绩单 134

7.1.1 创建表格 135

7.1.2 设置表格属性 136

7.1.3 编辑表格 137

7.1.4 使用CSS美化表格 140

7.2 学习任务：表格标签 141

7.2.1 使用表格标签制作网页

表格 141

7.2.2 在标签选择器中设置表格

的属性 142

7.3 案例2：使用表格布局图书

资源网 143

7.3.1 使用表格布局网页 144

7.3.2 导入Excel文档 145

7.3.3 使用CSS美化页面 147

7.4 案例3：设计旅游信息网 148

7.4.1 使用表格布局页面 149

7.4.2 在表格中插入网页元素 149

7.4.3 使用CSS美化页面 151

7.5 实训 151

7.5.1 实训一 设计健康

美食网 151

7.5.2 实训二 设计时尚

礼品网 152

7.6 习题 155

第8章 使用框架布局网页 156

8.1 案例1：使用框架布局休闲

音乐网页 156

8.1.1 认识框架与框架集 157

8.1.2 创建框架和框架集 157

8.1.3 保存框架和框架集 158

8.1.4 向框架中添加内容 159

8.2 学习任务：框架标签 160

8.3 案例2：使用框架布局校园

论坛页面 161

8.3.1 选择框架 162

8.3.2 拆分框架 162

8.3.3 设置框架集和框架属性 163

8.3.4 在框架中添加页面内容 164

8.3.5 通过链接框架制作导航 165

8.3.6 使用CSS美化页面 166

8.4 案例3：使用浮动框架布局宝贝

相册网页 167

8.5 实训：设计花园式楼盘网页 169

8.6 习题 171

第9章 使用流体网格布局网页 173

9.1 学习任务：流体网格布局概述 173

9.2 案例:使用流体网格布局购物网 173

9.2.1 创建流体网格布局 174

9.2.2　创建模块内容 175

9.3 实训：使用流体网格布局

宠物网 180

9.4 习题 181

第10章 使用Div布局网页 182

10.1 案例1：使用AP Div布局电影

资讯网页 182

10.1.1 AP Div概述 183

10.1.2 AP Div属性面板 183

10.1.3 “AP元素”面板 184

10.1.4 在AP Div中添加

网页元素 185

10.1.5 使用CSS美化页面 187

10.2 学习任务：使用CSS+Div布局

网页基础 187

10.2.1 AP Div标签与Div

标签 188

10.2.2 Div标签与span标签 189

10.2.3 盒子模型 190

10.2.4 元素的定位 192

10.2.5 常用CSS+Div布局

版式 193

10.3 案例2：定位在网页布局中

的应用 197

10.4 案例3：使用CSS+Div布局个人

Blog 199

10.5 实训 203

10.5.1 实训一 网页定位与

布局 203

10.5.2 实训二 使用Div+CSS布局

页面 204

10.6 习题 205

第11章 多媒体网页与网页

特效设计 207

11.1 学习任务：在网页中插入多

媒体对象 207

11.1.1 插入Flash动画 207

11.1.2 添加声音 210

11.1.3 插入FLV视频 211

11.2 学习任务：认识行为 212

11.2.1 行为概述 213

11.2.2 动作与事件 214

11.2.3 添加行为 216

11.3 学习任务：使用行为创建

网页特效 217

11.3.1 制作网页加载时弹出

公告页 217

11.3.2 使用行为设置图像

特效 218

11.3.3 使用行为设置状态栏

文本 220

11.3.4 使用行为设置跳转菜单

效果 222

11.4 实训 224

11.4.1 实训一 为宝贝相册网页

添加背景音乐 224

11.4.2 实训二 设置变换图像的

导航栏 224

11.5 习题 225

第12章 使用表单对象 22

本书第1版自2009年8月问世以来，以其新颖的编写体例和丰富的案例、实训内容，赢得了广大读者的普遍欢迎，2010年本书被教育部高等学校高职高专计算机类专业教学指导委员会评为优秀教材。2012年11月，结合读者的反馈信息和编写人员的反复斟酌，对本书第1版进行了修订，修订后的第2版体系结构更加合理，编排条理更加清晰，学习任务更加明确，案例和实训更加实用，内容更加通俗易懂，深受广大读者的欢迎。2013年8月，本书被教育部立项为“‘十二五’职业教育国家规划教材”。

随着Dreamweaver软件版本的升高，依据[2012]9号文件精神，编者对本书第2版进行了修订。本书为创新型教材，修订后的《网页设计与制作案例教程》（第3版）具有以下特点。

教材突出职业性。本书由多年从事“网页设计与制作”课程教学的优秀教师和经验丰富的企业网页设计师共同编写，保证了教材内容和职业标准与岗位要求相衔接，充分体现了职业性。

任务驱动教学。本书围绕学习任务，以学习者为中心，以职业能力为本位，循序渐进地介绍了网页设计制作的基本知识和操作技能，明确了“学什么”、“怎么学”，注重实践技能的培养。每章均安排了实训任务和课后习题，目的是增强学习的时效性和检验学习效果。

案例代表性强。本书包含一系列“由简到繁、由易到难、承前启后”的阶梯式案例，每个案例目标明确，操作步骤详尽，具有代表性。学习者通过案例学习，能有效地掌握网页设计制作的知识要点和技能技巧，并起到举一反三的作用。

编写体系合理。编者对本书的编写体系做了精心设计。全书分为16章，第1～2章介绍了网页、网站建设流程、HTML、网页版式设计与色彩搭配等基础知识；第3～14章系统地介绍了网页设计制作软件Dreamweaver CS6的功能和设计制作各类网页的方法技巧；第15～16章以Div+CSS作为技术架构，分别介绍了网站前台设计制作的综合应用实例。

教学资源丰富。本书是电子工业出版社“网页设计与制作”课程多媒体教学资源库的配套教材，配置了优质丰富的动画、微课、教学视频、案例、图片、教案、题库、教学文件等资源，学习者可以实现不受时间和空间限制的全天候学习。其中，微课视频涵盖了全书重要知识要点和操作技能难点，请扫描封底二维码或登录华信教育资源网（www.hxedu.com.cn）浏览。

本书非常适合高职高专院校学生学习，也是社会各类培训机构培训网页设计师的**教程，或广大网页设计爱好者的自学参考书。

本书由李敏统稿和定稿。全书编写分工如下：第1、7、8、9、12、13章由李敏编写，第2、4、10、14章由刘建超编写，第3、5、6章由刘春艳编写，第11章由李敏和刘建超共同编写，第15章由企业的高级工程师孙绪江编写，第16章由企业的网页设计师王洵编写。

本书是编者长期教学和实践经验的积累和总结，但书中难免存在疏漏和不妥之处，恳请广大读者提出宝贵意见和建议，以便修订时加以完善，谢谢。联系邮箱：lmbook@126.com。

编 者