网页设计与制作

精心设计

每章均按照“学习要点—学习目标—导读—知识点讲解—课堂案例—本章小结— 课后习题”的思路进行编写，内容充实、结构清晰、图文并茂。

注重实践

根据读者的需求，选取的实践案例从实际出发，循序渐进地帮助学生掌握网页设计的相关知识，熟悉软件功能和网页设计与制作的思路。

课程思政

导读中融入课程思政，提升个人情感和主动学习的思想觉悟，提高个人荣誉感和责任心，增强民族自信心。

随着互联网行业的飞速发展，网络已经成为人们获取信息的重要途径，也成为生活中不可缺少的一部分。因此，不仅要培养学生学会在网上寻找信息，而且力求培养学生掌握将信息上传到网络的技能，从而提高学生自身的信息素养，以适应更广阔的就业需求。本书根据读者的需求，选取的实践案例从实际出发，结合课程思政元素，以浅显易懂的方式讲解了网页制作的各项技能。

本书的上一版自2018年1月出版以来，受到广大读者的喜爱，被全国多所院校选为“网页设计”课程的教材，为各专业学生学习网页设计与制作提供了良好的理论和实践依据。经过多个轮次的使用，根据一线教师、学生和其他读者的反馈，我们在上一版基础上进行了改版，在保持原有内容和结构基本不变的前提下，对部分章节进行了扩展和删减。同时，结合课程思政元素，重新选取教材中的案例，在培养学生掌握知识结构的同时提高个人荣誉感和责任心、增强民族自信心。

本书共十章，分为四个部分，循序渐进地帮助学生掌握网页设计的相关知识，以及协同使用三个软件设计网页的操作流程。

第一部分 Dreamweaver CS6的使用（第1～7章）：主要介绍了创建站点和网站建设的基础知识，还介绍了网页中的文本、图像和多媒体的插入和编辑方法，并对页面之间的超链接、表格布局、CSS样式表、Div元素、CSS+Div布局页面、行为、模板和库等知识进行了详细讲解。

第二部分 Photoshop CS6的使用（第8章）：主要介绍了Photoshop的工作界面和基本操作、网页图像的编辑、图层的应用、网页图像的绘制与修饰、网页文本的制作、网页特效的实现及网页切片的输出等。

第三部分 Flash CS6的使用（第9章）：主要介绍了使用Flash软件制作网页动画，学习使用Flash软件中的图层和帧创建常见网页动画素材。

第四部分 综合案例（第10章）：通过一个完整的设计方案，介绍了使用三个软件分工协作制作摄影工作室网站的方法。

本书可作为非计算机专业学生学习网页设计的专用教材，也可作为网页设计初学者的参考用书。希望读者通过对本书的学习，能够提高网页相关信息的处理能力，以适应互联网的飞速发展。

本书配有精美的课件和教学素材，结构完整，便于教授相关课程的教师根据自身需求完善课件，提高教学质量。

本书由王潇、章明珠任主编，王娟和张娜任副主编，边国栋教授主审，在此对大家的辛勤工作表示衷心的感谢！

由于编者水平有限，虽然所有编者在编写本书的过程中倾注了大量心血，但书中难免存在疏漏和不足之处，恳请广大读者和专家指正。

编 者

2021年10月

第1章 网页制作与网站建设基础知识 1
1.1 网络基础知识 1
1.1.1 Internet基础知识 1
1.1.2 网页和网站 3
1.2 HTML概述 6
1.2.1 HTML的含义 6
1.2.2 HTML文件的基本结构 7
1.2.3 HTML常用标记 9
1.3 网页制作工具 11
1.3.1 Dreamweaver CS6 11
1.3.2 Photoshop CS6 11
1.3.3 Flash CS6 12
1.4 网页制作的基本流程 13
1.5 课堂案例—个人主页制作 13
1.5.1 案例目标 13
1.5.2 操作思路 14
1.6 本章小结 15
1.7 课后习题 15
第2章 使用Dreamweaver CS6创建网页文档 16
2.1 熟悉Dreamweaver CS6工作界面 17
2.1.1 工作界面的组成 17
2.1.2 可视化辅助工具 20
2.1.3 设置首选参数 23
2.2 创建和管理站点 25
2.2.1 规划站点 25
2.2.2 管理站点 26
2.2.3 管理站点中的文件 29
2.3 网页文档基本操作 30
2.3.1 新建网页文档 30
2.3.2 保存、打开网页文档 31
2.3.3 设置页面属性 32
2.4 课堂案例—“学院网站”创建多个网页 33
2.4.1 案例目标 33
2.4.2 操作思路 34
2.5 本章小结 37
2.6 课后习题 37
第3章 网页中的基本对象 38
3.1 网页中的文本 38
3.1.1 直接输入 39
3.1.2 复制/粘贴外部文本 39
3.1.3 导入外部文件 40
3.1.4 插入特殊字符 40
3.1.5 插入项目列表和编号列表 41
3.1.6 设置文本属性 43
3.2 网页中的图像 45
3.2.1 网页中的图像格式 45
3.2.2 插入图像 46
3.2.3 设置图像属性 48
3.2.4 跟踪图像 49
3.3 网页中的多媒体 50
3.3.1 认识网页中的多媒体 51
3.3.2 网页中插入Flash动画 51
3.3.3 网页中插入FLV视频 53
3.3.4 网页中插入音频对象 54
3.3.5 网页中插入其他媒体文件 56
3.4 超链接 57
3.4.1 基本概念 57
3.4.2 设置超链接 59
3.4.3 常用超链接 59
3.5 课堂案例—制作“中国航天”网站 64
3.5.1 案例目标 64
3.5.2 操作思路 65
3.6 本章小结 68
3.7 课后习题—制作“中国航天”网站 68
第4章 AP Div和行为 71
4.1 AP Div 71
4.1.1 AP Div简介 71
4.1.2 AP Div的应用 73
4.2 行为 75
4.2.1 基本概念 76
4.2.2 应用行为 77
4.2.3 编辑行为 83
4.3 课堂案例—制作“西安翻译学院”首页 83
4.3.1 案例目标 83
4.3.2 操作思路 84
4.4 本章小结 86
4.5 课后习题—制作“个人网站”首页 86
第5章 使用表格布局网页 88
5.1 表格概述 88
5.1.1 表格的基本概念 89
5.1.2 表格的组成 89
5.2 在网页中插入表格 90
5.2.1 插入表格 90
5.2.2 选择表格 91
5.3 设置表格和单元格属性 93
5.3.1 设置表格属性 93
5.3.2 设置单元格属性 94
5.4 操作表格 94
5.4.1 调整表格和单元格的大小 94
5.4.2 插入或删除行或列 94
5.4.3 拆分或合并单元格 96
5.4.4 剪切、复制、粘贴表格 97
5.4.5 编辑表格数据 98
5.4.6 删除表格元素 99
5.5 使用表格布局网页 100
5.5.1 使用简单表格布局网页 100
5.5.2 使用复杂表格布局网页 101
5.6 课堂案例—制作“辉煌100年”网站首页 102
5.6.1 案例目标 102
5.6.2 操作思路 103
5.7 本章小结 106
5.8 课后习题—制作网站“我的家乡陕西”首页 106
第6章 应用CSS+Div布局网页 108
6.1 CSS样式表 108
6.1.1 基本概念 109
6.1.2 基本语法 109
6.1.3 CSS选择器类型 110
6.1.4 CSS样式的位置 111
6.2 CSS在Dreamweaver中的应用 112
6.2.1 创建CSS样式表 112
6.2.2 管理CSS样式表 113
6.2.3 CSS样式属性 115
6.3 课堂案例1—制作“江山如此多娇”网站 120
6.3.1 案例目标 121
6.3.2 操作思路 121
6.4 CSS+Div布局 129
6.4.1 Div概述 129
6.4.2 Web标准 132
6.4.3 盒子模型 133
6.4.4 盒子的定位 134
6.4.5 经典布局模式 136
6.5 课堂案例2—制作“长征精神”网站 137
6.5.1 案例目标 137
6.5.2 操作思路 137
6.6 本章小结 144
6.7 课后习题 144
第7章 模板和库 146
7.1 模板 147
7.1.1 创建模板 147
7.1.2 编辑模板 148
7.1.3 管理模板 149
7.1.4 创建基于模板的网页 150
7.2 库 151
7.2.1 创建库项目 152
7.2.2 向页面添加库项目 153
7.2.3 更新库项目 153
7.3 课堂案例—制作“垃圾分类网”网站 154
7.3.1 案例目标 154
7.3.2 操作思路 155
7.4 本章小结 157
7.5 课后习题—制作“中国瓷器文化网”首页 157
第8章 使用Photoshop CS6制作网页素材 159
8.1 图形图像的基础知识 159
8.1.1 位图和矢量图 159
8.1.2 像素和分辨率 160
8.1.3 常用文件格式 161
8.1.4 常用颜色模式 161
8.2 Photoshop CS6基本操作 162
8.2.1 进入Photoshop CS6 162
8.2.2 新建和打开图像文件 163
8.2.3 保存和关闭图像文件 164
8.2.4 视图的控制 164
8.2.5 辅助工具 165
8.2.6 设置前景色/背景色 166
8.3 选择图像 167
8.3.1 使用选框工具选取 167
8.3.2 使用套索工具选取 169
8.3.3 使用魔棒工具选取 171
8.3.4 使用钢笔工具选取 171
8.3.5 编辑选区 172
8.4 绘制和修复图像 174
8.4.1 图像的裁剪和移动 174
8.4.2 填充与描边 175
8.4.3 图像绘画工具 178
8.4.4 图像修复工具 180
8.4.5 图像的变换 181
8.5 图层 181
8.5.1 图层面板 183
8.5.2 图层的种类 183
8.5.3 图层的基本操作 184
8.5.4 图层样式 186
8.5.5 图层蒙版特效 187
8.6 文本 188
8.6.1 创建文本 188
8.6.2 设置文本格式 190
8.6.3 设置文本变形 192
8.7 切片工具 192
8.7.1 创建和编辑切片 192
8.7.2 图像的优化与切片的输出 194
8.8 课堂案例—设计制作“读书网”网站页面 197
8.9 本章小结 201
8.10 课后习题 201
第9章 使用Flash CS6制作网页动态素材 203
9.1 动画制作基础 204
9.1.1 Flash CS6工作界面 204
9.1.2 Flash CS6的基本操作 206
9.1.3 动画制作原理 207
9.1.4 Flash动画的种类 207
9.2 动画中的图层 208
9.2.1 图层的概念 208
9.2.2 图层的类型 208
9.2.3 图层的基本操作 209
9.3 动画中的帧 210
9.3.1 帧的种类及创建 210
9.3.2 帧的基本操作 211
9.4 补间动画 213
9.4.1 传统补间动画 214
9.4.2 补间动画 215
9.4.3 形状补间动画 217
9.5 课堂案例—制作网站动画 218
9.5.1 练习目标 218
9.5.2 操作步骤 218
9.6 本章小结 221
9.7 课后习题—制作“绿色出行 低碳生活”网页动画 221
第10章 综合案例—“最美瞬间摄影工作室”网站首页 222
10.1 网站目标 222
10.2 案例分析 223
10.3 制作过程 223
10.3.1 使用Photoshop CS6制作网站首页 223
10.3.2 使用Flash CS6制作网站动画 230
10.3.3 使用Dreamweaver CS6制作页面 234
参考文献 241

1. 新媒体内容创作实务（微课版） [主编　覃思源]
2. 人工智能基础 [主编 余平 张春阳]
3. 人工智能导论 [主编 王飞 潘立武]
4. Amazing！儿童英语自然拼读分级教材（全8册） [王玲　编著]
5. Spark大数据处理技术 [主编　刘仁山　周洪翠　庄新妍]
6. 毫无PS痕迹—你的第一本Photoshop书（第二版） [赵鹏 著]
7. 电视新闻制作 [主编 王晓翠 刘传琳]
8. C语言同步案例习题精解 [主编 肖朝晖]
9. Python程序设计 [李国燕 王新强 刘佳 等编著]
10. 高等数学（下册） [秦红兵]
11. 智慧畜牧业技术 [主编 连卫民 张志明 王辉]
12. Python程序设计项目化教程（活页式） [主编　卢凤伟]
13. 人工智能算法与实践 [主编　梁琨　张翼英]
14. Python办公自动化—玩转Excel [郝春吉 刘智杨 周永福 黄 诠]
15. 人工智能概论（第二版） [张广渊　周风余　朱振方　著]
16. Web安全基础及项目实践 [主编 郑丽 安厚霖 崔俊鹏]
17. 电路与电子技术Ⅲ——模拟电子技术 [主编 刘峰]
18. 线性代数 [主编 惠小健 王震 卢鸿艳]
19. 信息安全技术基础（第二版） [主编 张浩军 陈莉 王峰]
20. 电气与控制工程项目管理 [邹红利 滕璇璇 陈德山 编著]
21. 计算机网络技术项目化教程（微课版） [主编 王艳萍 安华萍]
22. 自然拼读背单词：基础英语4000词（微课版） [陈雪　编著]
23. 剪枝——庭院常见植物修剪 [［英］大卫·斯夸尔]
24. 电子产品生产与检测 [主编　李恒　杨国辉　练斌]
25. Web前端开发项目化教程（微课版） [主编　郭立文　王洪波]
26. 数据清洗 [黄源　刘智杨　孙大松]
27. 计算机应用基础与实践（Windows 7平台与Office 2016应用） [主编 吕波 何敏]
28. 程序员考前冲刺100题 [黄少年 李竹村 曾哲军 编著]
29. 办公自动化高级应用案例教程（微课版） [高海波 张诚 杨顺]
30. UI创意设计（活页式） [主　编　赵艳莉]