目录CONTENTS
模块一 使用HTML5搭建网页
案例1 第一个HTML5网页 2
1.1 案例描述 2
1.2 案例实现 2
1.3 相关知识点 4
1.3.1 网页相关概念 4
1.3.2 常用的网页编辑软件 6
1.3.3 常用的浏览器 7
案例小结 7
习题与实训 7
扩展阅读 8
案例2 公司介绍网页 8
2.1 案例描述 9
2.2 案例实现 9
2.3 相关知识点 10
2.3.1 HTML5文档的基本结构 10
2.3.2 HTML标记及其属性 11
2.3.3 HTML文本标记 12
案例小结 15
习题与实训 15
案例3 新闻列表网页 17
3.1 案例描述 17
3.2 案例实现 17
3.3 相关知识点 18
3.3.1 无序列表 18
3.3.2 有序列表 19
3.3.3 列表嵌套 20
3.3.4 自定义列表 21
案例小结 23
习题与实训 23
案例4 简单公司网站 23
4.1 案例描述 24
4.2 案例实现 25
4.2.1 新建项目 25
4.2.2 创建网站首页 25
4.2.3 创建公司简介页面 26
4.2.4 创建所获荣誉页面 27
4.2.5 创建管理团队页面 27
4.3 相关知识点 29
4.3.1 HTML超链接标记 29
4.3.2 HTML图像标记 30
4.3.3 绝对路径和相对路径 33
案例小结 34
习题与实训 34
扩展阅读 35
模块二 使用CSS3美化网页
案例5 新闻详情网页 37
5.1 案例描述 37
5.2 案例实现 37
5.3 相关知识点 39
5.3.1 引入CSS样式 39
5.3.2 CSS常用文本属性 43
案例小结 47
习题与实训 47
案例6 百度搜索结果网页 49
6.1 案例描述 49
6.2 案例实现 49
6.3 相关知识点 51
6.3.1 CSS常用选择器 51
6.3.2 CSS的高级特性 55
案例小结 57
习题与实训 57
案例7 手机展示网页 58
7.1 案例描述 58
7.2 案例实现 59
7.3 相关知识点 60
7.3.1 盒子模型的概念 60
7.3.2 盒子模型的相关属性 62
案例小结 68
习题与实训 68
案例8 山东介绍网页 69
8.1 案例描述 69
8.2 案例实现 70
8.3 相关知识点 72
8.3.1 设置背景颜色及背景图像 72
8.3.2 设置不透明度 77
8.3.3 设置渐变效果 79
案例小结 80
习题与实训 80
扩展阅读 81
案例9 美丽风光网页 81
9.1 案例描述 81
9.2 案例实现 82
9.3 相关知识点 83
9.3.1 元素的类型 83
9.3.2 块元素间的外边距 84
9.3.3 元素的浮动 87
案例小结 91
习题与实训 91
案例10 笔记本电脑展示网页 91
10.1 案例描述 91
10.2 案例实现 92
10.3 相关知识点 95
10.3.1 元素的定位 95
10.3.2 定位类型 95
10.3.3 z-index属性 99
案例小结 99
习题与实训 99
案例11 公司新闻块 100
11.1 案例描述 101
11.2 案例实现 101
11.3 相关知识点 104
11.3.1 列表样式设置 104
11.3.2 超链接样式设置 105
案例小结 106
习题与实训 106
案例12 导航条 107
12.1 案例描述 107
12.2 案例实现 108
12.3 相关知识点 110
元素类型的转换 110
案例小结 112
习题与实训 112
模块三 创建表格和表单
案例13 手机型号表 114
13.1 案例描述 114
13.2 案例实现 114
13.3 相关知识点 117
13.3.1 表格标记 117
13.3.2 合并单元格 118
13.3.3 定义表格CSS样式 119
案例小结 122
习题与实训 122
案例14 登录表单 123
14.1 案例描述 123
14.2 案例实现 123
14.3 相关知识点 125
14.3.1 表单标记 125
14.3.2 <input>控件 126
案例小结 129
习题与实训 129
案例15 调查问卷表单 131
15.1 案例描述 131
15.2 案例实现 131
15.3 相关知识点 135
15.3.1 <select>控件 135
15.3.2 <textarea>控件 137
案例小结 138
习题与实训 138
模块四 使用CSS3实现动画效果
案例16 图片遮罩效果 140
16.1 案例描述 140
16.2 案例实现 140
16.3 相关知识点 142
16.3.1 过渡属性 142
16.3.2 遮罩动画原理 146
案例小结 146
习题与实训 146
案例17 图片变形效果 147
17.1 案例描述 147
17.2 案例实现 148
17.3 相关知识点 151
案例小结 155
习题与实训 155
案例18 图片翻转效果 155
18.1 案例描述 156
18.2 案例实现 156
18.3 相关知识点 158
18.3.1 翻转动画原理 158
18.3.2 3D变形 159
案例小结 163
习题与实训 163
案例19 魔方动画效果 164
19.1 案例描述 164
19.2 案例实现 164
19.3 相关知识点 166
19.3.1 @keyframes—定义动画的
关键帧 166
19.3.2 设置动画属性 167
案例小结 170
习题与实训 170
模块五 使用JavaScript添加动态效果
案例20 输出信息 173
20.1 案例描述 173
20.2 案例实现 173
20.3 相关知识点 174
20.3.1 JavaScript的常见应用 174


20.3.2 JavaScript的语法规则 175
20.3.3 JavaScript的引入方式 175
20.3.4 输入/输出方法 177
案例小结 178
习题与实训 178
案例21 表单验证 179
21.1 案例描述 179
21.2 案例实现 180
21.3 相关知识点 183
21.3.1 变量 183
21.3.2 数据类型 184
21.3.3 运算符 185
21.3.4 函数 186
21.3.5 DOM简介 187
案例小结 188
习题与实训 188
案例22 简单计算器 189
22.1 案例描述 189
22.2 案例实现 190
22.3 相关知识点 192
22.3.1 分支语句 192
22.3.2 数据类型转换 195
22.3.3 事件与事件调用 197
案例小结 198
习题与实训 199
案例23 限时促销 200
23.1 案例描述 200
23.2 案例实现 201
23.3 相关知识点 204

23.3.1 面向对象简介 204
23.3.2 Date对象 205
23.3.3 BOM简介 207
案例小结 209
习题与实训 210
案例24 轮播图 211
24.1 案例描述 211
24.2 案例实现 211
24.3 相关知识点 214
24.3.1 设置元素样式 214
24.3.2 获取元素尺寸和位置 215
案例小结 217
习题与实训 217
模块六 综合案例
案例25 小米商城网站 219
25.1 案例描述 219
25.2 前期工作 220
25.3 制作网站主页 221
25.4 制作网站登录页 243
25.5 制作网站注册页 243
案例小结 243
案例26 美丽山东网站 243
26.1 案例描述 243
26.2 网站规划 245
26.3 制作网站主页 248
26.4 制作初识山东页面 264
26.5 制作景点详情页 264
案例小结 264