通过本书的学习，能快速上手网站前端开发。为了使HTML5语言能被读者更好地掌握和套用，同时作为“跟兄弟连学HTML5系列教程”的第一本入门级图书，本书对HTML语言的知识点进行了详细的阐述和分析，包括HTML5和CSS3的语法、各种页面布局方法、流行的前端框架Bootstrap等内容。不仅有通俗易懂的语法讲解，也用贴切的小案例实验，使读者能轻鬆掌握新知识，且可以快速上手前端技术操作。本书适合对前端技术开发感兴趣的初学者阅读，也可以作为从事前端技术工作的开发人员的参考书，或作为大学生学习HTML5的教材。同时，本书也为读者之后学习同系列其他图书奠定基础。

第1章 介绍HTML5 1

1.1 了解HTML5的主流套用 1

1.1.1 表单的强大 2

1.1.2 回响式页面布局 2

1.1.3 与用户互动的特效 4

1.1.4 微网站的製作 5

1.1.5 基于HTML5的移动APP开发 6

1.1.6 HTML5游戏 7

1.1.7 多媒体的套用 7

1.2 什幺是HTML5 8

1.2.1 HTML5和HTML的关係 8

1.2.2 HTML和CSS的关係 10

1.2.3 HTML5和CSS3的关係 11

1.2.4 HTML5和JavaScript的关係 11

1.3 HTML5的靠山 12

1.3.1 W3C是什幺 12

1.3.2 IETF是什幺 13

1.3.3 RFC是什幺 14

1.3.4 WHATWG是什幺 14

1.3.5 Web的新标準 14

1.4 HTML5的曲折发展过程 15

1.4.1 HTML5的诞生 15

1.4.2 浏览器之间的大战 16

1.4.3 HTML5技术的套用现状 18

1.4.4 HTML5平台的兴起 18

1.4.5 HTML5行业的发展预测 20

1.5 HTML5的学习线路图 21

1.5.1 第一阶段——学习网页製作 23

1.5.2 第二阶段——编写用户互动功能 24

1.5.3 第三阶段——成为前端工程师 25

本章小结 26

本章习题 26

第2章 HTML5的基本语法 28

2.1 课前準备 28

2.1.1 了解Web 29

2.1.2 了解HTML 30

2.1.3 了解HTML运行原理 30

2.1.4 如何选择开发工具 31

2.1.5 认识浏览器中的开发者工具 32

2.1.6 现在学习HTML5的方式 34

2.1.7 简单HTML实例製作 35

2.2 HTML语言的语法 36

2.2.1 HTML标籤和元素 36

2.2.2 HTML语法不区分字母大小写 37

2.2.3 HTML标籤属性 37

2.2.4 HTML颜色值的设定 37

2.2.5 HTML文档注释 38

2.2.6 HTML代码格式 38

2.2.7 HTML字元实体 38

2.3 HTML文档的主体结构 39

2.3.1 HTML文档类型的新定义方式 40

2.3.2 HTML文档的主体标籤 41

2.4 HTML文档头部标籤 41

2.4.2 标籤42
2.4.3 标籤43
2.4.4 标籤43
2.5 HTML文档主体标籤44
2.6 HTML5做到了与之前版本的兼容45
2.6.1 可以省略标记的元素45
2.6.2 具有boolean值的属性46
2.6.3 引号的使用46
2.7 设定IE 9以下版本浏览器支持HTML546
本章小结47
本章习题47
第3章 HTML5文字版面和编辑标籤49
3.1 HTML基础标籤49
3.1.1 标题标籤～50
3.1.2 换行标籤
和段落标籤

51
3.1.3 水平分隔线标籤51
3.1.4 格式标籤51
3.1.5 文本标籤53
3.2 使用HTML表格55
3.3 HTML框架结构57
本章小结60
本章习题61
第4章 多媒体套用62
4.1 创建图像和连结62
4.1.1 URL概述63
4.1.2 插入图片63
4.1.3 建立锚点和超连结64
4.2 HTML图像地图66
4.2.1 什幺是图像地图66
4.2.2 图像地图如何製作66
4.2.3 实现图像地图67
4.3 新增多媒体播放元素68
本章小结71
本章习题71
第5章 HTML5表单74
5.1 HTML表单中的get和post方法74
5.1.1 get方法75
5.1.2 post方法76
5.1.3 HTML表单中get和post的区别76

5.2 HTML表单设计77
5.2.1 表单标籤77
5.2.2 文本域和密码域78
5.2.3 提交、重置和普通按钮78
5.2.4 单选按钮和複选框79
5.2.5 隐藏域79
5.2.6 多行文本域79
5.2.7 选单下拉列表域79
5.2.8 综合实例80
5.3 HTML5新增表单元素82
5.3.1 元素82
5.3.2 元素83
5.3.3 元素84
5.4 多样的输入类型85
5.4.1 email85
5.4.2 url86
5.4.3 number87
5.4.4 range87
5.4.5 date picker88
5.4.6 color89
5.5 HTML占新增的表单属性91
5.5.1 autocomplete属性92
5.5.2 autofocus属性93
5.5.3 form属性94
5.5.4 form overrides表单重写属性95
5.5.5 height和width属性95
5.5.6 list属性96
5.5.7 min、max和step属性96
5.5.8 multiple属性97
5.5.9 novalidate属性97
5.5.10 pattern属性98
5.5.11 placeholder属性98
5.5.12 required属性99
5.6 HTML5表单提交综合实例100
本章小结103
本章习题103
第6章 CSS3揭秘105
6.1 CSS简介105
6.2 CSS规则的组成107
6.2.1 CSS注释108
6.2.2 长度单位108
6.2.3 颜色单位和URL值109
6.3 在HTML文档中放置CSS的几种方式110
6.3.1 内联样式表110
6.3.2 嵌入一张样式表110
6.3.3 连结到一张外部的样式表111
6.4 CSS普通选择器111
6.4.1 HTML选择器111
6.4.2 类选择器112
6.4.3 id选择器112
6.4.4 关联选择器113
6.4.5 组合选择器113
6.4.6 伪元素选择器113

6.5 CSS常见的样式属性和值114
6.5.1 字型属性114
6.5.2 颜色属性115
6.5.3 背景属性115
6.5.4 文本属性116
6.5.5 框线属性117
6.5.6 滑鼠游标属性118
6.5.7 列表属性119
6.5.8 CSS综合实例120
6.6 CSS3概述122
6.6.1 CSS3在选择器上的支持122
6.6.2 CSS3在样式上的支持122
6.6.3 CSS3对于动画的支持123
6.6.4 在实际开发中该如何使用CSS3123
6.7 CSS複杂选择器123
6.7.1 基本选择器123
6.7.2 多元素的组合选择器124
6.7.3 属性选择器124
6.7.4 结构性伪类选择器125
6.8 CSS3属性129
6.8.1 使用CSS3属性前的準备130
6.8.2 框线属性130
6.8.3 背景属性132
6.8.4 文本属性133
6.8.5 用户界面属性133
6.8.6 动画属性134
6.8.7 多列布局属性134
6.8.8 渐变属性135
6.8.9 透明属性136
6.8.10 旋转属性136
6.8.11 伺服器端字型属性136
本章小结137
本章习题137
第7章 CSS3属性特效140
7.1 新增颜色模式140
7.2 文字142
7.2.1 文字阴影143
7.2.2 文字描边146
7.2.3 文字排版150
7.2.4 定义省略文本的处理方式152
7.3 自定义文字153
7.4 弹性盒模型156
7.5 盒模型阴影164
7.6 倒影167
7.7 CSS3分栏布局173
7.7.1 列个数和列宽度173
7.7.2 列之间的缝隙间隔宽度175
7.7.3 分栏间隔符176
7.8 圆角177
7.8.1 border-radius属性177
7.8.2 单个圆角的设定180
7.9 框线181
7.9.1 框线图片border-image182
7.9.2 自适应的圆角效果186
7.10 渐变188
7.10.1 CSS3渐变介绍188
7.10.2 线性渐变189
7.10.3 线性渐变实例189
7.10.4 径向渐变194
7.10.5 径向渐变实例194
7.11 CSS3背景198
7.11.1 多背景198
7.11.2 background-size200
7.11.3 background-origin202
7.11.4 background-clip203
7.12 遮罩204
7.13 transition过渡206
7.14 2D变换207
7.14.1 translate()方法208
7.14.2 rotate()方法209
7.14.3 scale()方法212
7.14.4 skew()方法213
7.15 3D变换215
7.15.1 transform-style216
7.15.2 perspective景深216
7.15.3 perspective-origin景深基点218
7.15.4 3D位移219
7.15.5 3D旋转222
7.15.6 3D缩放223
7.15.7 3D盒子225
7.16 animation动画226
7.16.1 关键帧keyframes227
7.16.2 animation动画属性229
本章小结229
本章习题230
第8章 DIV+CSS网页标準化布局232
8.1 DIV+CSS页面布局的优势232
8.2 “无意义”的HTML标籤和233
8.3 W3C盒子模型234
8.4 和页面布局有关的CSS属性236
8.5 盒子区块框的定位238
8.5.1 相对定位238
8.5.2 绝对定位239

8.6 使用盒子模型的浮动布局240
8.6.1 设定浮动240
8.6.2 行框和清理242
8.7 DIV+CSS的兼容性问题244
8.7.1 不同浏览器解释盒子模型的差异245
8.7.2 设定浏览器去遵循W3C标準246
8.8 使用盒子模型设计页面布局247
8.8.1 居中设计247
8.8.2 设定两列浮动的布局248
8.8.3 设定三列浮动的布局250
8.8.4 设定多列浮动的布局251
8.9 DIV+CSS网站首页布局示例252
8.9.1 HTML档案的设计253
8.9.2 CSS档案的设计254
本章小结256
本章习题256
第9章 回响式布局259
9.1 回响式布局的优缺点259
9.2 如何设计回响式布局260
9.3 回响式布局实例261
9.4 Media Queries模组的使用方法263
9.4.1 语法结构及用法264
9.4.2 可用的设备类型265
9.4.3 可用的设备特性参数266
9.5 在移动设备上设定原始大小显示268
9.6 回响式网站的内容设计268
9.6.1 回响式图片显示内容设计269
9.6.2 回响式文字显示内容设计269
9.7 回响式网站的设计流程270
本章小结271
本章习题272
第10章 认识和使用Sass273
10.1 初识Sass273
10.1.1 Sass是什幺274
10.1.2 Sass的作用274
10.1.3 Sass的安装277
10.1.4 Sass的使用和编译279
10.2 Sass基本语法与使用实例283
10.2.1 Sass基本语法283
10.2.2 Sass使用实例288
本章小结292
本章习题292
第11章 栅格布局294
11.1 栅格294
11.2 盒子模型296
11.3 栅格实例297
11.4 Bootstrap框架298
11.4.1 Bootstrap现状299
11.4.2 栅格系统299
本章小结313
本章习题313
第12章 Bootstrap的快速入门315
12.1 Bootstrap的内容概述与整体理解315
12.1.1 全局CSS样式316
12.1.2 组件317
12.1.3 JavaScript外挂程式319
12.2 Bootstrap搭建环境320
12.3 Bootstrap全局CSS样式321
12.3.1 全局CSS样式的栅格系统和回响式布局322
12.3.2 全局CSS样式的表单324
12.4 Bootstrap组件324
12.5 Bootstrap的JavaScript外挂程式326
本章小结328
本章习题328

第13章 Bootstrap的实战330
13.1 实战概述330
13.2 实战需求330
13.3 实战準备333
13.3.1 Sass配置334
13.3.2 HTML的基本模组335
13.4 顶部工具列336
13.4.1 Bootstrap的字型图示组件336
13.4.2 Bootstrap的下拉选单组件337
13.4.3 Bootstrap的输入框组组件339
13.4.4 Bootstrap的导航组件341
13.4.5 顶部工具列PC端内容填充342
13.4.6 顶部工具列PC端样式最佳化345
13.4.7 实战顶部工具列移动端352
13.5 页面导航条353
13.5.1 Bootstrap的导航条组件354
13.5.2 实战页面导航条——内容填充356
13.5.3 实战页面导航条——样式最佳化358
13.6 banner区360
13.6.1 Bootstrap的JavaScript轮播图外挂程式360
13.6.2 实战banner区362
13.7 推荐位364
13.7.1 Bootstrap的缩略图组件364
13.7.2 Bootstrap的面板组件365
13.7.3 实战第一种风格的推荐位——内容填充366
13.7.4 实战第一种风格的推荐位——样式最佳化369
13.7.5 实战第二种风格的推荐位——内容填充372
13.7.6 实战第二种风格的推荐位——样式最佳化375
13.8 脚部379
13.9 用户登录380
13.9.1 Bootstrap的表单全局CSS样式380
13.9.2 Bootstrap的模态框JavaScript外挂程式382
13.9.3 实战用户登录384
本章小结386
本章习题387
附录A388