第1章　创建html文档 1

1.1　HTML文档的基本结构 2

1.2　HTML文档类型 2

1.3　利用HTML元素定义中文网页 3

1.4　利用title定义网页的标题 4

1.5　利用meta元素定义页面元信息 5

1.6　利用head元素定义文档头部 7

1.7　利用body元素定义文档主体 8

1.8　利用base元素定义基底网址 9

1.9　定义网页在不同显示媒体下的样式 10

1.10　指定外部资源的link元素 12

1.11　添加网站Logo 14

1.12　预先获取资源Link Prefetch 15

1.13　利用******元素定义客户端脚本 16

1.14　添加注释 16

1.15　载入外部脚本库 18

1.16　延迟脚本执行 19

1.17　异步执行脚本 20

1.18　利用no******元素实现脚本的替代内容 24

1.19　HTML属性 25

1.20　为元素指定类或ID名称 25

1.21　为元素添加title属性 27

第2章　头部 meta元素 28

2.1　定义页面关键字 28

2.2　设置页面描述 29

2.3　设定作者信息 30

2.4　限制搜索方式 31

2.5　网页语言与文字 33

2.6　定时跳转页面 34

2.7　设定网页缓存过期时间 35

2.8　禁止从缓存中调用 36

2.9　删除过期的Cookie 38

2.10 设置网页的过渡效果 39

第3章 标记文字 44

3.1　标题＜hn＞＜/hn＞ 45

3.2　表示关键字和产品名称＜b＞＜/b＞ 48

3.3　强调＜em＞＜/em＞ 49

3.4　表示外文词语或科技术语＜i＞＜/i＞ 50

3.5　表示重要的文字＜strong＞＜/strong＞ 52

3.6　表示不正确或校正＜s＞＜/s＞ 53

3.7　为文字添加下画线＜u＞＜/u＞ 54

3.8　添加小号字体内容＜small＞＜/small＞ 55

3.9　添加上标＜sub＞＜/sub＞和下标＜sup＞＜/sup＞ 56

3.10　强制换行＜br/＞ 57

3.11　指明可以安全换行的建议位置＜wbr＞ 58

3.12　表示输入和输出＜code＞＜var＞＜samp＞＜kbd＞ 60

3.13　表示缩写＜abbr＞＜/abbr＞ 63

3.14　定义术语＜dfn＞＜/dfn＞ 64

3.15　引用来自他处的内容＜q＞＜/q＞ 66

3.16　引用其他作品的标题＜cite＞＜/cite＞ 67

3.17　表示时间和日期＜time＞＜/time＞ 68

3.18　ruby、rt和rp元素 69

3.19　bdo元素 69

3.20 bdi元素 70

3.21 表示一段一般性的内容 ＜span＞＜/span＞ 71

3.22 突出显示文本＜mark＞＜/mark＞ 73

第4章 显示图像 75

4.1 必须知道的图像格式和压缩形式 75

4.2 图像＜img＞的超简应用 77

4.3 语义化带标题的图片 78

4.4 提前载入图片 79

4.5 图像区域映射 80

4.6 使用base64:URL格式的图片 82

第5章 生成超链接 86

5.1 生成指向外部的超链接 87

5.2 使用相对URL 87

5.3 生成页面内超链接 88

5.4 图像链接 90

5.5 电子邮件链接 91

5.6 设定浏览环境 92

5.7 在框架中打开 92

第6章 组织文字内容 94

6.1 段落 94

6.2 页面主体的结构化布局 96

6.3 使用预先编排好格式的内容 99

6.4 引用他处内容 101

6.5 添加主题分隔线 103

6.6 将内容组织为列表 104

6.7 输出有顺序关系的内容 104

6.8 使用无序列表输出无序并列的内容 105

6.9 使用自定义列表输出有标题的并列内容 106

6.10 列表项的使用 107

6.11 使用菜单列表 108

6.12 使用下拉列表 109

6.13 在页面中输出对话 110

第7章 划分文档结构 112

7.1 添加基本的标题 113

7.2 隐藏子标题hgroup 114

7.3 生成节＜section＞ 115

7.4 为区域添加头部和尾部 117

7.5 添加导航区域 119

7.6 在页面中输出文章 120

7.7 生成附注栏 122

7.8 在页面输出联系人信息 124

7.9 生成详情区域 124

第8章 多媒体文件 126

8.1 使用多媒体打造丰富的视觉效果 126

8.2 全面兼容的video 127

8.3 多媒体文件标签 130

8.4 object元素 130

8.5 param元素 132

8.6 嵌入flash代码 134

8.7 实现Flash全屏播放 135

8.9 文字的滚动 135

8.10 定义媒介源 136

8.11 定义媒介外部文本轨道 136

第9章 表格 138

9.1 生成基本的表格 138

9.2 让表格没有凹凸感 142

9.3 添加表头 143

9.4 为表格添加结构 144

9.5 制作不规则的表格 148

9.6 正确地设置表格列 150

9.7 设置表格边框 153

9.8 其他表格设计 157

第10章 表单与文件 166

10.1 制作基本表单 166

10.2 自动聚焦 168

10.3 禁用单个input元素 169

10.4 关闭输入框的自动提示功能 171

10.5 关闭输入法 171

10.6 按回车键跳转至下一个输入框 172

10.7 定制input元素 173

10.8 生成隐藏的数据项 175

10.9 输入验证 176

10.10 生成按钮 177

10.11 使用表单外的元素 178

10.12 显示进度 178

10.13 密钥对生成器 179

第11章 网页中的框架 180

11.1 在页面中使用****** 180

11.2 设置******透明背景色 182

11.3 让******高度自适应 182

11.4 垂直框架 183

11.5 水平框架 184

11.6 混合框架 184

11.7 使用＜noframes＞标签 185

第12章 HTML 5 Canvas 187

12.1 在页面中使用canvas元素 187

12.2 使用路径和坐标 189

12.3 绘制弧形和圆形 192

12.4 用纯色填充图形 194

12.5 使用渐变色填充 196

12.6 在画布中绘制文本 199

12.7 将画布输出为PNG图片文件 201

12.8 复杂场景使用多层画布 203

12.9 使用requestAnimationFrame制作游戏或动画 203

12.10 如何显示满屏canvas 206

12.11 canvas圆环进度条 207

第13章 HTML 5地理定位 210

13.1 使用navigator对象 210

13.2 获取当前位置 213

13.3 浏览器支持 215

第14章 HTML 5本地存储 216

14.1 在客户端存储数据 216

14.2 检查HTML 5存储支持 217

14.3 利用localStorage进行本地存储 217

14.4 利用localStorage存储JSON对象 219

14.5 利用localStorage记录用户表单输入 220

14.6 利用localStorage进行跨文档数据传递 223

14.7 在localStorage中存储图片 225

14.8 在localStorage中存储文件 227

14.9 使用localForage进行离线存储 229

14.10 利用sessionStorage进行本地存储 230

第15章 HTML 5应用缓存 234

15.1 使用cache manifest创建页面缓存 234

15.2 离线web网页或应用 236

15.3 删除本地缓存 237

15.4 更新缓存文件 238

15.5 使用HTML 5离线应用程序缓存事件 238

15.6 如何失效缓存 242

第16章 移动开发 245

16.1 手机上直接电话呼叫或短信 245

16.2 设置iPhone书签栏图标 247

16.3 HTML 5表单 250

16.4 HTML 5相册 252

第17章 其他常用代码 255

17.1 让IE支持HTML 5标签 255

17.2 网页自动关闭 258

17.3 地址栏换成自己的图标 259

17.4 网页不能另存 259

17.5 禁止查看网页源代码 260

17.6 网页不出现滚动条 261

17.7 设定打开网页的大小 261

17.8 变换当前网页的光标

目前互联网上的绝大部分网页都是使用HTML编写的，微信里所有的动画游戏和酷炫页面基本都是使用HTML 5编写的。由此可以看出，HTML**是目前*流行*酷炫的页面设计语言。

本书是一本讲解HTML代码实践的书，它为读者全面深入地讲解了针对各种屏幕大小设计和开发现代网站的HTML技术。300余段代码给读者带来的不仅仅是网页结构设计的提速，更是教会读者如何应对HTML中涉及的跨浏览器兼容，如何处理结构语义化搜索引擎优化、创建高性能网页等时时刻刻困扰网页开发人员的问题。

HTML中的那些槛儿

这些常见的HTML问题，你了解多少？

• 跨浏览器的兼容。
• 网页文字内容组织。
• 页面布局。
• 划分文档结构。
• 多媒体文件的引入。
• 处理框架。

以上所有内容在本书的代码中都有讲解，除了这些常见HTML问题外，本书还力求将*有用的HTML代码汇总在一起，提供各种解决实际问题的跨浏览器方案。

如何学习HTML

11个字就能帮助我们更好地学习HTML。

• 多看、多练：观摩成功的网页结构，分析并练习网页设计中常用的HTML结构代码。
• 多想、多问：思考设计实现的原理，提出自己的问题并通过各种渠道来寻找答案。
• 多总结：记录前人已经探索出来的HTML结构技巧，总结实战中碰到的问题及解决方案。
• 只要真正能做到勤思考、勤动手、勤总结，HTML学习定能一马平川。

本书的内容安排

本书共17章，各章节分别介绍了HTML的不同内容，安排如下。

第1章　为创建HTML文档，介绍HTML文档的基本结构，包括认识HTML文档类型，并介绍使用head元素、title元素、meta元素、body元素、base元素等创建HTML文档的主要部分，并详细介绍定义网页在不同媒体中显示的样式、 指定外部资源的Link元素、添加网站Logo、预先获取资源Link Prefetch、利用******元素定义客户端脚本、内嵌脚本、载入外部脚本库、延迟脚本执行、异步执行脚本、no****** 元素、HTML属性、为元素指定类或ID名称、为元素添加title属性、添加注释等常用技术。

第2章　为头部meta元素，介绍网页中常见的元数据信息的定义方式，包括定义页面关键字、设置页面描述、强制打开新窗口、编辑工具、设定作者信息、限制搜索方式、网页语言与文字、定时跳转页面、设定网页缓存过期时间、禁止从缓存中调用、删除过期的cookie、设置网页的过渡效果等。

第3章　为标记文字，介绍网页上*常见的内容——文字的标记技术，包括标题显示，表示关键字和产品名称的文案的展示，强调文案的展示方式，表示外文词语或科技术语的展示，表示不正确或校正的展示，表示重要的文字的展示，为文字添加下画线的方法，添加小号字体内容的元素，添加上标和下标的方法，指明可以安全换行的建议位置的方法，表示输入和输出的元素，使用标题引用、引文、定义和缩写，定义术语的元素，引用来自他处的内容的设计方法，表示时间和日期的元素等。

第4章　为显示图像，介绍网页使用图像相关的知识点，从图像格式开始，到图像的使用、语义化图像等，介绍了图像的几种常用的使用方法与使用场景。

第5章　为生成超链接，详细介绍超链接的生成、使用以及不同的使用场景，包括生成指向外部的超链接、使用相对URL、生成页面内部的超链接、设定浏览环境、图像链接、在框架中打开等技巧。

第6章　为组织文字内容，网页的外观是否美观，在很大程度上取决于其排版，本章介绍文字内容的组织，包括段落、页面主体的结构化布局、使用预先编排好格式的内容、引用他处内容、添加主题分隔线、将内容组织为列表、输出有顺序关系的内容、使用无序列表输出无序并列的内容、使用自定义列表输出有标题的并列内容、列表项的使用、使用菜单列表、使用下拉列表、在页面中输出对话等。

第7章　为划分文档结构，包括添加基本的标题、隐藏子标题hgroup、 生成节＜section＞、 为区域添加头部和尾部、添加导航区域、 在页面中输出文章、生成附注栏、 在页面输出联系人信息、生成详情区域等。

第8章　为多媒体文件，包括使用多媒体打造丰富的视觉效果、全面兼容的video、多媒体文件标签、object 元素、param 元素、嵌入Flash代码、实现Flash全屏播放、文字的滚动、定义媒介源、定义媒介外部文本轨道等技术。

第9章　为表格，包括生成基本的表格、让表格没有凹凸感、添加表头、为表格添加结构、制作不规则的表格、正确地设置表格列、设置表格边框、其他表格设计等技术。

第10章　为表单与文件，包括制作基本表单、自动聚焦、禁用单个input元素、关闭输入框的自动提示功能、关闭输入法、按回车键跳转到下一个输入框、定制input元素、生成隐藏的数据项、输入验证、生成按钮、使用表单外的元素、显示进度、密钥对生成器等技术。

第11章　为网页中的框架，包括在页面中使用******、设置******透明背景色、让******高度自适应、垂直框架、水平框架、混合框架、使用＜noframes＞标签等技术。

第12章　为HTML 5 Canvas，包括在页面中使用Canvas元素、使用路径和坐标、绘制弧形和圆形、用纯色填充图形、使用渐变色填充、在画布中绘制文本、将画布输出为PNG图片文件、复杂场景使用多层画布、使用requestAnimationFrame制作游戏或动画、如何显示满屏Canvas、Canvas圆环进度条等技术。

第13章　为HTML 5 地理定位，包括使用navigator对象、获取当前位置、浏览器支持等技术。

第14章　为HTML 5 本地存储，包括在客户端存储数据、检查HTML 5 存储支持、利用localStorage进行本地存储、利用localStorage存储JSON对象、利用localStorage记录用户表单输入、利用localStorage进行跨文档数据传递、在localStorage中存储图片、在localStorage中存储文件、使用localForage进行离线存储、利用sessionStorage进行本地存储等技术。

第15章　为HTML 5 应用缓存，包括使用cache manifest创建页面缓存、离线Web网页或应用、删除本地缓存、更新缓存文件、使用HTML 5离线应用程序缓存事件、如何使缓存失效等技术。

第16章　为移动开发，包括手机上直接电话呼叫或短信、设置iPhone书签栏图标、HTML 5表单、HTML 5相册等技术。

第17章　为其他常用代码，包括让IE支持HTML 5标签、网页自动关闭、地址栏换成自己的图标、网页不能另存、禁止查看网页源代码、网页不出现滚动条、设定打开网页的大小、变换当前网页的光标等技术。

本书面对的读者

• 网页设计入门者
• 网页开发入门者
• HTML学习爱好者
• 由HTML 4向HTML 5转型的开发人员
• 中小型企业网站开发者
• 微信内网页开发人员
• 大中专院校的学生
• 各种IT培训学校的学生
• 网站后台开发人员
• 网站建设与网页设计的相关威客兼职人员

编辑推荐

HTML是永恒的页面语言，不管是PC端还是移动端，不管是微信的页面还是iOS、Android的页面，都离不开HTML。随着移动APP的流行，HTML 5也发挥了越来越大的作用。本书是一本HTML代码书，300余段代码能让你更轻松地学会HTML，更得心应手地应用HTML。