畅销20万册经典Web前端教材**版
国家十五、十一五规划教材
北理工“我最喜爱的教师”编写
HTML5+CSS3+JavaScript+Dreamweaver+vue+angular
每章都有实战案例，游戏相关案例备受学生欢迎
配套素材、源代码、教学PPT、教学视频、习题参考答案、试题库

本书系统全面地介绍了网页制作和前端开发技术的基本理论和实际应用。全书共10章，逻辑上可分为三大部分。前5章为第1部分，主要介绍了网页制作的基本理论——HTML 和CSS，同时介绍了Photoshop在网页制作过程中的应用；第6章和第7章为第2部分，主要介绍了CSS技术的高级应用技巧和JavaScript编程，并对各种常见的前端开发技术进行了系统梳理；最后3章为第3部分，其中，第8章从心理学和设计理论视角介绍了如何进行网页设计，第9章介绍了如何使用Dreamweaver 进行网站开发，第10章则从项目实践的角度论述了如何设计和开发一个网站，使读者能够在具体应用中巩固所学知识。
本书以实用为基本出发点，不仅包括各种网页制作和前端开发技术的基础理论，还强调了它们的具体应用，使读者既能打下坚实的理论基础，又能掌握实际的操作技能。本书绝大部分内容经过了长期的教学检验，证明是重点突出而详略得当的。本书可作为各类本科院校、高等职业学校、成人高校和培训班讲授“网页制作”和“前端开发”等课程的教材或参考书，也适合广大爱好者或相关从业人员自学之用。

赵丰年，北京理工大学“我爱我师”评选十佳教师，软件学院“我最喜爱的教师”，北京理工大学“T-more优秀教师奖”一等奖，负责***精品课程2门，***教优秀学团队成员，主编北京市精品教材3部，***规划教材4部，研究方向：数字媒体技术、教育技术、游戏化（gamification）。成果：发表学术论文和教改论文多篇，获得***和省部级教学奖多项。

第 1章 HTML5 基础．．．．．．．．．．．．．．．．．．． 1
1．1　什么是HTML ．．．．．．．．．．．．．．．．．．．．．．．1
1．1．1　网页的基本概念．．．．．．．．．．．．．．．．．．．．．．．．　1
1．1．2　HTML 的工作原理．．．．．．．．．．．．．．．．．．．．　3
1．1．3　创建和测试网页．．．．．．．．．．．．．．．．．．．．．．．．　5
1．1．4　网页编辑工具．．．．．．．．．．．．．．．．．．．．．．．．．．．．　6
1．2　创建网页．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．7
1．2．1　标记符基础．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　7
1．2．2　网页的基本结构．．．．．．．．．．．．．．．．．．．．．．．．　8
1．2．3　在网页中添加内容．．．．．．．．．．．．．．．．．．．　12
1．3　综合实例：人物介绍网页．．．．．．．．13
练习题　．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．15

第　2章 文本格式与超链接．．．．．．．．．．．．　16
2．1　设置文本格式．．．．．．．．．．．．．．．．．．．．．．16
2．1．1　段落格式．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　16
2．1．2　字体格式．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　19
2．1．3　列表格式．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　20
2．2　创建超链接．．．．．．．．．．．．．．．．．．．．．．．．．22
2．2．1　URL 概述．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　22
2．2．2　页面链接．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　23
2．2．3　锚点链接．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　25
2．3　综合实例：唐诗宋词网站．．．．．．．．27
2．3．1　网站规划．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　28
2．3．2　网页设计．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　29
2．3．3　网页制作．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　30
练习题　．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．33

第3章　CSS3 基础．．．．．．．．．．．．．．．．．．．．　34
3．1　CSS 入门．．．．．．．．．．．．．．．．．．．．．．．．．．34
3．1．1　什么是CSS ．．．．．．．．．．．．．．．．．．．．．．．．．．．．34
3．1．2　CSS 样式定义．．．．．．．．．．．．．．．．．．．．．．．．．35
3．1．3　CSS 的属性单位．．．．．．．．．．．．．．．．．．．．．36
3．2　在网页中使用CSS ．．．．．．．．．．．．．．37
3．2．1　使用站点样式．．．．．．．．．．．．．．．．．．．．．．．．．．37
3．2．2　使用网页样式．．．．．．．．．．．．．．．．．．．．．．．．．．39
3．2．3　使用行内样式．．．．．．．．．．．．．．．．．．．．．．．．．．39
3．3　CSS3 基本选择器．．．．．．．．．．．．．．．40
3．3．1　标记符选择器．．．．．．．．．．．．．．．．．．．．．．．．．．40
3．3．2　类选择器．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．41
3．3．3　ID 选择器．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．41
3．3．4　伪类选择器．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．42
3．3．5　群组选择器．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．43
3．4　CSS3 基础属性．．．．．．．．．．．．．．．．．．43
3．4．1　颜色与背景属性．．．．．．．．．．．．．．．．．．．．．．．43
3．4．2　字体属性．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．45
3．4．3　文本属性．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．47
3．5　综合实例：电影欣赏网站．．．．．．．．48
3．5．1　网站规划与设计．．．．．．．．．．．．．．．．．．．．．．．49
3．5．2　网页制作．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．50
练习题　．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．53

第4章　图像与多媒体．．．．．．．．．．．．．．．．．．　54
4．1　网页图像基础．．．．．．．．．．．．．．．．．．．．．．54
4．1．1　位图与矢量图．．．．．．．．．．．．．．．．．．．．．．．．．．54
4．1．2　网页图像格式．．．．．．．．．．．．．．．．．．．．．．．．．．55
4．1．3　使用网页图像的要点．．．．．．．．．．．．．．．．56
4．2　图像处理基本操作．．．．．．．．．．．．．．．．57
4．2．1　Photoshop 的界面．．．．．．．．．．．．．．．．．．57
4．2．2　修改图像的大小．．．．．．．．．．．．．．．．．．．．．．．58
4．2．3　调整图像的颜色．．．．．．．．．．．．．．．．．．．．．．．58
4．2．4　修补图像与抠像．．．．．．．．．．．．．．．．．．．．．．　59
4．2．5　用适当的格式保存图像．．．．．．．．．．．．．　61
4．3　图像标记符img ．．．．．．．．．．．．．．．．．．．62
4．3．1　插入图像．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　62
4．3．2　设置图像属性．．．．．．．．．．．．．．．．．．．．．．．．．．　63
4．4　使用多媒体对象．．．．．．．．．．．．．．．．．．．67
4．4．1　多媒体对象概述．．．．．．．．．．．．．．．．．．．．．．　67
4．4．2　插入多媒体对象．．．．．．．．．．．．．．．．．．．．．．　67
练习题　．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．70

第5章　表格与表单．．．．．．．．．．．．．．．．．．．．．　72
5．1　创建表格．．．．．．．．．．．．．．．．．．．．．．．．．．．．72
5．1．1　表格的基本构成．．．．．．．．．．．．．．．．．．．．．．　72
5．1．2　合并单元格．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　74
5．1．3　构造表格的步骤．．．．．．．．．．．．．．．．．．．．．．　74
5．2　表格的属性设置．．．．．．．．．．．．．．．．．．．75
5．2．1　边框与分隔线．．．．．．．．．．．．．．．．．．．．．．．．．．　75
5．2．2　控制单元格空白．．．．．．．．．．．．．．．．．．．．．．　76
5．2．3　表格的对齐．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　78
5．3　创建表单．．．．．．．．．．．．．．．．．．．．．．．．．．．．80
5．3．1　什么是表单．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　80
5．3．2　表单控件的类型．．．．．．．．．．．．．．．．．．．．．．　82
5．3．3　form 标记符．．．．．．．．．．．．．．．．．．．．．．．．．．．．　82
5．4　创建表单控件．．．．．．．．．．．．．．．．．．．．．．83
5．4．1　文本框与密码框．．．．．．．．．．．．．．．．．．．．．．　83
5．4．2　复选框与单选框．．．．．．．．．．．．．．．．．．．．．．　84
5．4．3　按钮．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　86
5．4．4　多行文本框．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　87
5．4．5　选项菜单．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　88
5．5　综合实例：表格与表单．．．．．．．．．．．89
5．5．1　复杂表格页面．．．．．．．．．．．．．．．．．．．．．．．．．．　89
5．5．2　登录注册页面．．．．．．．．．．．．．．．．．．．．．．．．．．　90
练习题　．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．93

第6章　CSS3 进阶．．．．．．．．．．．．．．．．．．．．　95
6．1　CSS3 高级选择器．．．．．．．．．．．．．．．．95
6．1．1　后代选择器．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．95
6．1．2　子元素选择器．．．．．．．．．．．．．．．．．．．．．．．．．．97
6．1．3　相邻兄弟选择器．．．．．．．．．．．．．．．．．．．．．．．97
6．1．4　属性选择器．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．98
6．2　CSS3 布局．．．．．．．．．．．．．．．．．．．．．．．．99
6．2．1　CSS 盒模型．．．．．．．．．．．．．．．．．．．．．．．．．．．．99
6．2．2　CSS 定位概述．．．．．．．．．．．．．．．．．．．．．．．103
6．2．3　浮动定位．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．105
6．2．4　相对定位．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．107
6．2．5　绝对定位与固定定位．．．．．．．．．．．．．．．108
6．3　CSS3 高级属性．．．．．．．．．．．．．．．．　111
6．3．1　分类属性．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．111
6．3．2　列表属性．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．113
6．3．3　特效属性．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．115
6．4　CSS3 样式的优先级．．．．．．．．．．．　118
6．4．1　一般性规则．．．．．．．．．．．．．．．．．．．．．．．．．．．．118
6．4．2　样式优先级的计算．．．．．．．．．．．．．．．．．．119
6．5　综合实例：中华美食网站．．．．．．　122
6．5．1　网站规划与设计．．．．．．．．．．．．．．．．．．．．．123
6．5．2　网页制作．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．124
练习题　．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　130

第7章　JavaScript 与前端开发技术．．．．．．．．．．131
7．1　使用客户端脚本．．．．．．．．．．．．．．．．．　131
7．1．1　使用script 标记符．．．．．．．．．．．．．．．．．131
7．1．2　直接添加脚本．．．．．．．．．．．．．．．．．．．．．．．．132
7．1．3　链接脚本文件．．．．．．．．．．．．．．．．．．．．．．．．132
7．2　JavaScript 编程．．．．．．．．．．．．．．．　133
7．2．1　JavaScript 语言基础．．．．．．．．．．．．．133
7．2．2　使用JavaScript 对象．．．．．．．．．．．．．139
7．2．3　使用浏览器对象．．．．．．．．．．．．．．．．．．．．．144
7．2．4　使用HTML DOM 对象．．．．．．．．．．147
7．3　前端开发技术．．．．．．．．．．．．．．．．．．．．　159
7．3．1　使用jQuery ．．．．．．．．．．．．．．．．．．．．．．．．．．159
7．3．2　使用Bootstrap．．．．．．．．．．．．．．．．．．．．．　164
7．3．3　使用Vue．js ．．．．．．．．．．．．．．．．．．．．．．．．．．　172
7．3．4　使用AngularJS ．．．．．．．．．．．．．．．．．．．　176
7．3．5　使用React．．．．．．．．．．．．．．．．．．．．．．．．．．．　179
练习题　．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　180

第8章　网页设计基础．．．．．．．．．．．．．．．．　182
8．1　设计与认知．．．．．．．．．．．．．．．．．．．．．．．　182
8．1．1　格式塔理论概述．．．．．．．．．．．．．．．．．．．．　182
8．1．2　认知时的组织原则．．．．．．．．．．．．．．．．．　182
8．2　设计原则．．．．．．．．．．．．．．．．．．．．．．．．．．　185
8．2．1　紧凑原则．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　185
8．2．2　对齐原则．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　187
8．2．3　重复原则．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　189
8．2．4　对比原则．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　190
8．3　设计适于扫描的网页．．．．．．．．．．．．　191
8．3．1　建立清楚的视觉层次．．．．．．．．．．．．．．　192
8．3．2　使用习惯用法．．．．．．．．．．．．．．．．．．．．．．．．　193
8．3．3　划分明确的页面区域．．．．．．．．．．．．．．　194
8．3．4　减轻视觉污染．．．．．．．．．．．．．．．．．．．．．．．．　194
8．4　设计导航．．．．．．．．．．．．．．．．．．．．．．．．．．　195
8．4．1　网页导航惯例．．．．．．．．．．．．．．．．．．．．．．．．　195
8．4．2　全局导航．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　196
8．4．3　站点ID．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　197
8．4．4　导航条．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　198
8．4．5　实用工具．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　198
8．4．6　返回主页．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　198
8．4．7　搜索功能．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　199
8．4．8　页面名称．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　199
8．4．9　当前位置与面包屑．．．．．．．．．．．．．．．．．　200
8．4．10　网站导航测试．．．．．．．．．．．．．．．．．．．．．．　202
8．5　设计版式．．．．．．．．．．．．．．．．．．．．．．．．．．202
8．5．1　页面比例．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　202
8．5．2　网页的分栏．．．．．．．．．．．．．．．．．．．．．．．．．．．　203
8．5．3　版面率．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　205
8．5．4　图版面积．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　206
8．5．5　跳跃率．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　207
练习题　．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．　208

第9章　用Dreamweaver制作网页．．．．．．．．．．．．　210
9．1　Dreamweaver 的界面．．．．．．．　210
9．2　使用本地站点．．．．．．．．．．．．．．．．．．．．　211
9．2．1　创建本地站点．．．．．．．．．．．．．．．．．．．．．．．．211
9．2．2　站点文件操作．．．．．．．．．．．．．．．．．．．．．．．．213
9．3　编辑网页．．．．．．．．．．．．．．．．．．．．．．．．．．　215
9．3．1　制作网页的一般过程．．．．．．．．．．．．．．215
9．3．2　使用文本．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．217
9．3．3　使用超链接．．．．．．．．．．．．．．．．．．．．．．．．．．．．218
9．3．4　使用图像．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．220
9．3．5　使用音频与视频．．．．．．．．．．．．．．．．．．．．．221
9．3．6　使用表格．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．222
9．3．7　使用表单．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．225
9．4　使用CSS 样式．．．．．．．．．．．．．．．．．　227
9．4．1　创建CSS 样式表．．．．．．．．．．．．．．．．．．227
9．4．2　定义样式规则．．．．．．．．．．．．．．．．．．．．．．．．229
9．4．3　应用样式规则．．．．．．．．．．．．．．．．．．．．．．．．230
9．4．4　使用CSS 设计页面布局．．．．．．．．．230
9．5　高级功能．．．．．．．．．．．．．．．．．．．．．．．．．．　232
9．5．1　快速代码编写．．．．．．．．．．．．．．．．．．．．．．．．232
9．5．2　响应式网页设计．．．．．．．．．．．．．．．．．．．．．237
9．5．3　使用Bootstrap ．．．．．．．．．．．．．．．．．．．．．243
9．5．4　使用jQuery ．．．．．．．．．．．．．．．．．．．．．．．．．．248
练习题　．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．249

第　10章 综合项目实践．．．．．．．．．．．．．．．．　251
10．1　网站开发的项目管理．．．．．．．．．．　251
10．1．1　网站开发流程．．．．．．．．．．．．．．．．．．．．．．251
10．1．2　网站开发团队．．．．．．．．．．．．．．．．．．．．．．253
10．1．3　网站策划书．．．．．．．．．．．．．．．．．．．．．．．．．．254
10．2　“游戏天地”网站规划．．．．．．．．256
10．2．1　网站目标．．．．．．．．．．．．．．．．．．．．．．．．．．．．　256
10．2．2　站点风格与技术因素．．．．．．．．．．．．　256
10．2．3　信息架构．．．．．．．．．．．．．．．．．．．．．．．．．．．．　257
10．3　“游戏天地”网站设计．．．．．．．257
10．3．1　导航设计．．．．．．．．．．．．．．．．．．．．．．．．．．．．　258
10．3．2　页面设计．．．．．．．．．．．．．．．．．．．．．．．．．．．．　259
10．4　“游戏天地”网站实现．．．．．．．　261
10．4．1　实现流程．．．．．．．．．．．．．．．．．．．．．．．．．．．．　261
10．4．2　网页基本结构的实现．．．．．．．．．．．．　262
10．4．3　典型页面的实现．．．．．．．．．．．．．．．．．．　265
练习题　．．．．．．．．．．．．．．．．．．．．．．．．．．．．．．276
附录1　HTML 和CSS 颜色表．．．　278
附录2　HTML5 快速参考．．．．．．．．．．　280
附录3　CSS3 快速参考．．．．．．．．．．．．　283