第1章 初识HTML5 1
1.1 HTML5概述 1
1.1.1 HTML5发展历程 1
1.1.2 HTML5的优势 2
1.1.3 HTML5浏览器支持情况 3
1.1.4 创建第一个HTML5页面 4
1.2 HTML5基础 6
1.2.1 HTML5文档基本格式 6
1.2.2 HTML5语法 7
1.2.3 HTML标记 8
1.2.4 标g记的属性 10
1.2.5 HTML5文档头部相关标记 12
1.3 文本控制标记 15
1.3.1 标题和段落标记 15
1.3.2 文本格式化标记 19
1.3.3 特殊字符标记 21
1.4 图像标记 21
1.4.1 常用图像格式 21
1.4.2 图像标记<img/> 22
1.4.3 绝对路径和相对路径 26
1.5 超链接标记 27
1.5.1 创建超链接 27
1.5.2 锚点链接 28
1.6 阶段案例——制作HTML5百科页面 30
1.6.1 分析效果图 31
1.6.2 制作页面 31
1.6.3 制作页面链接 34
本章小结 35
动手实践 35
第2章 HTML5页面元素及属性 37
2.1 列表元素 37
2.1.1 ul元素 37
2.1.2 ol元素 38
2.1.3 dl元素 40
2.1.4 列表的嵌套应用 41
2.2 结构元素 42
2.2.1 header元素 42
2.2.2 nav元素 43
2.2.3 article元素 44
2.2.4 aside元素 45
2.2.5 section元素 46
2.2.6 footer元素 47
2.3 分组元素 48
2.3.1 figure元素和figcaption元素 48
2.3.2 hgroup元素 49
2.4 页面交互元素 51
2.4.1 details元素和summary元素 51
2.4.2 progress元素 52
2.4.3 meter元素 53
2.5 文本层次语义元素 54
2.5.1 time元素 54
2.5.2 mark元素 55
2.5.3 cite元素 56
2.6 全局属性 57
2.6.1 draggable属性 57
2.6.2 hidden属性 58
2.6.3 spellcheck属性 58
2.6.4 contenteditable属性 59
2.7 阶段案例——制作电影影评网 59
2.7.1 分析效果图 61
2.7.2 制作页面 61
本章小结 66
动手实践 67
第3章 CSS3入门 68
3.1 CSS3简介 68
3.1.1 CSS概述 68
3.1.2 CSS3发展历史 69
3.1.3 CSS3浏览器支持情况 70
3.2 CSS核心基础 71
3.2.1 CSS样式规则 71
3.2.2 引入CSS样式表 72
3.2.3 CSS基础选择器 77
3.3 文本样式属性 82
3.3.1 字体样式属性 82
3.3.2 文本外观属性 87
3.4 CSS高级特性 96
3.4.1 CSS层叠性和继承性 96
3.4.2 CSS优先级 98
3.5 阶段案例——制作服装推广软文 102
3.5.1 分析效果图 102
3.5.2 制作页面结构 102
3.5.3 定义CSS样式 103
本章小结 105
动手实践 105
第4章 CSS3选择器 106
4.1 属性选择器 106
4.1.1 E[att^=value]属性选择器 106
4.1.2 E[att$=value]属性选择器 108
4.1.3 E[att*=value]属性选择器 109
4.2 关系选择器 110
4.2.1 子代选择器(>) 110
4.2.2 兄弟选择器(+、~) 111
4.3 结构化伪类选择器 113
4.3.1 :root选择器 113
4.3.2 :not选择器 115
4.3.3 :only-child选择器 116
4.3.4 :first-child和:last-child选择器 117
4.3.5 :nth-child(n)和:nth-last-child(n)选择器 118
4.3.6 :nth-of-type(n)和:nth-last-of-type(n)选择器 119
4.3.7 :empty选择器 121
4.3.8 :target选择器 122
4.4 伪元素选择器 123
4.4.1 :before选择器 123
4.4.2 :after选择器 124
4.5 链接伪类 125
4.6 阶段案例——制作网页设计软件列表 126
4.6.1 分析效果图 127
4.6.2 制作页面结构 128
4.6.3 定义CSS样式 130
本章小结 132
动手实践 133
第5章 CSS盒子模型 134
5.1 盒子模型概述 134
5.1.1 认识盒子模型 134
5.1.2 <div>标记 136
5.1.3 盒子的宽与高 138
5.2 盒子模型相关属性 139
5.2.1 边框属性 139
5.2.2 边距属性 148
5.2.3 box-shadow属性 152
5.2.4 box-sizing属性 153
5.3 背景属性 155
5.3.1 设置背景颜色 155
5.3.2 设置背景图像 156
5.3.3 背景与图片不透明度的设置 156
5.3.4 设置背景图像平铺 158
5.3.5 设置背景图像的位置 158
5.3.6 设置背景图像固定 160
5.3.7 设置背景图像的大小 161
5.3.8 设置背景的显示区域 163
5.3.9 设置背景图像的裁剪区域 164
5.3.10 设置多重背景图像 166
5.3.11 背景复合属性 167
5.4 CSS3渐变属性 169
5.4.1 线性渐变 169
5.4.2 径向渐变 171
5.4.3 重复渐变 172
5.5 阶段案例——制作音乐排行榜 174
5.5.1 分析效果图 175
5.5.2 制作页面结构 175
5.5.3 定义CSS样式 176
本章小结 178
动手实践 178
第6章 浮动与定位 180
6.1 元素的浮动 180
6.1.1 元素的浮动属性float 180
6.1.2 清除浮动 184
6.2 overflow属性 190
6.3 元素的定位 192
6.3.1 元素的定位属性 192
6.3.2 静态定位static 193
6.3.3 相对定位relative 193
6.3.4 绝对定位absolute 195
6.3.5 固定定位fixed 198
6.3.6 z-index层叠等级属性 198
6.4 元素的类型与转换 198
6.4.1 元素的类型 198
6.4.2 <span>标记 201
6.4.3 元素的转换 202
6.5 阶段案例——制作网页焦点图 204
6.5.1 分析效果图 205
6.5.2 制作页面结构 205
6.5.3 定义CSS样式 206
本章小结 209
动手实践 209
第7章 表单的应用 211
7.1 认识表单 211
7.1.1 表单的构成 211
7.1.2 创建表单 212
7.2 表单属性 213
7.3 input元素及属性 215
7.3.1 input元素的type属性 216
7.3.2 input元素的其他属性 224
7.4 其他表单元素 231
7.4.1 textarea元素 231
7.4.2 select元素 232
7.4.3 datalist元素 236
7.4.4 keygen元素 237
7.4.5 output元素 238
7.5 CSS控制表单样式 239
7.6 阶段案例——制作信息登记表 241
7.6.1 分析效果图 242
7.6.2 制作页面结构 243
7.6.3 定义CSS样式 245
本章小结 247
动手实践 247
第8章 多媒体技术 249
8.1 HTML5多媒体的特性 249
8.2 多媒体的支持条件 250
8.2.1 视频和音频编解码器 250
8.2.2 多媒体的格式 251
8.2.3 支持视频和音频的浏览器 251
8.3 嵌入视频和音频 252
8.3.1 在HTML5中嵌入视频 252
8.3.2 在HTML5中嵌入音频 254
8.3.3 音、视频中的source元素 255
8.3.4 调用网页多媒体文件 257
8.4 CSS控制视频的宽高 258
8.5 视频和音频的方法和事件 260
8.6 HTML5音、视频发展趋势 262
8.7 阶段案例——制作音乐播放界面 262
8.7.1 分析效果图 263
8.7.2 制作页面结构 263
8.7.3 定义CSS样式 264
本章小结 267
动手实践 267
第9章 CSS3高级应用 269
9.1 过渡 269
9.1.1 transition-proper 269
属性 269
9.1.2 transition-duration属性 271
9.1.3 transition-timing-function属性 272
9.1.4 transition-delay属性 274
9.1.5 transition属性 274
9.2 变形 274
9.2.1 认识transform 274
9.2.2 2D转换 275
9.2.3 3D转换 282
9.3 动画 287
9.3.1 @keyframes 287
9.3.2 animation-name属性 288
9.3.3 animation-duration属性 288
9.3.4 animation-timing-function属性 290
9.3.5 animation-delay属性 292
9.3.6 animation-iteration-count属性 292
9.3.7 animation-direction属性 292
9.3.8 animation属性 294
9.4 阶段案例——制作工作日天气预报 294
9.4.1 分析效果图 295
9.4.2 制作页面结构 296
9.4.3 定义CSS样式 297
9.4.4 制作CSS3动画 301
本章小结 306
动手实践 306
第10章 实战开发——制作电商网站首页 308
10.1 准备工作 309
10.2 首页面详细制作 314
本章小结 340
动手实践 340