Chapter 01 从零起步——HTML轻松入门 2
1.1 认识HTML 2
1.1.1 什么是HTML 2
1.1.2 使用浏览器浏览文件 2
1.2 HTML文件的基本标记 3
1.2.1 开始标签〈html〉 3
1.2.2 头部标签〈head〉 3
1.2.3 标题标签〈title〉 4
1.2.4 主体标签〈body〉 4
1.2.5 元信息标签〈meta〉 5
1.2.6 〈!DOCTYPE〉标签 5
1.3 文字基本标记 6
1.3.1 段落标签的用法 6
1.3.2 换行标签的用法 7
1.3.3 不换行标签的用法 8
1.3.4 加粗标签的用法 9
1.3.5 倾斜标签的用法 9
1.3.6 标题标签的用法 10
本章小结 12
Chapter 02 网页设计基本功——表格的使用 14
2.1 表格的基本元素 14
2.2 表格的相关代码 14
2.2.1 表格标签〈table〉 15
2.2.2 行标签〈tr〉 16
2.2.3 单元格标签〈td〉 17
2.2.4 表格的结构标签 18
2.2.5 设置表格标题 21
2.3 设置表格大小和行内属性 22
2.3.1 设置整个表格的大小 22
2.3.2 设置表格中行的属性 23
2.3.3 设置行的背景颜色 24
2.3.4 设置行内文字的对齐方式 25
2.4 设置表格边框样式 28
2.4.1 表格的边框宽度 28
2.4.2 表格的边框颜色 29
2.4.3 表格中的单元格间距 30
2.4.4 表格中文字与边框间距 31
2.5 设置表格的背景 33
2.5.1 设置表格背景颜色 33
2.5.2 为表格背景插入图像 34
2.6 设置单元格的样式 35
2.6.1 设置单元格的大小 35
2.6.2 设置单元格的背景颜色 36
2.6.3 设置单元格的边框颜色 38
2.6.4 合并单元格 39
本章小结 41
Chapter 03 丰富见面——图像的插入 43
3.1 图片的格式 43
3.2 插入图片 43
3.2.1 使用img标签 43
3.2.2 图片的源文件 44
3.2.3 设置图片大小 45
3.2.4 设置图片提示文字 45
3.2.5 图片的对齐方式 47
3.2.6 图片的边框 48
3.3 为图片添加超链接 49
本章小结 50
Chapter 04 网页交互——表单的使用 52
4.1 表单的基本标签 52
4.1.1 〈form〉标签 52
4.1.2 〈input〉标签 53
4.1.3 〈textarea〉标签 54
4.1.4 〈select〉标签 55
4.2 表单的基本属性 56
4.2.1 action属性 56
4.2.2 name属性 57
4.2.3 method属性 57
4.2.4 enctype属性 58
4.2.5 target属性 59
4.3 插入表单对象 59
4.3.1 文本域 59
4.3.2 密码域 60
4.3.3 普通按钮 61
4.3.4 单选按钮 62
4.3.5 复选框 63
4.3.6 提交按钮 64
4.3.7 重置按钮 65
4.3.8 图像按钮 66
4.3.9 隐藏域 67
4.3.10 文件域 68
4.3.11 菜单和列表 69
4.4 创建一个注册类表单页面 71
本章小结 74
Chapter 05 网页链接——创建超链接 76
5.1 超链接的路径 76
5.1.1 绝对路径 76
5.1.2 相对路径 76
5.2 创建超链接 76
5.2.1 超链接标签的属性 76
5.2.2 内部链接 77
5.2.3 锚点链接 78
5.2.4 外部链接 81
本章小结 84
Chapter 06 视听效果——添加多媒体 86
6.1 插入多媒体 86
6.1.1 插入Flash动画 86
6.1.2 插入音频 87
6.1.3 插入视频 87
6.2 滚动效果 88
6.2.1 设置滚动速度 88
6.2.2 设置滚动方向 89
6.2.3 设置滚动延迟 90
6.2.4 设置滚动方式 91
6.2.5 设置滚动循环 92
6.2.6 设置滚动背景颜色 93
6.2.7 设置滚动范围 94
6.2.8 设置空白空间 95
本章小结 96
Chapter 06 HTML升级——HTML5入门知识 98
7.1 什么是HTML5 98
7.1.1 认识HTML5 98
7.1.2 HTML5的发展 98
7.2 HTML5新增功能 99
7.2.1 字符集和DOCTYPE的改进 99
7.2.2 引入的新元素 100
7.2.3 标准改进 100
7.3 HTML5的优势 101
7.3.1 HTML5化繁为简 101
7.3.2 用户优先和效率 101
7.4 HTML5新增的主体元素 102
7.4.1 article元素 102
7.4.2 section元素 103
7.4.3 nav元素 106
7.4.4 aside元素 107
7.4.5 time元素 108
7.4.6 pubdate属性 109
7.5 HTML5新增的非主体元素 110
7.5.1 header元素 110
7.5.2 hgroup元素 112
7.5.3 footer元素 113
7.5.4 address元素 114
7.6 HTML5新增的元素属性 115
7.6.1 表单相关属性 115
7.6.2 其他相关属性 116
7.7 HTML5新增与废除的元素 116
7.7.1 HTML5中新增的元素 116
7.7.2 HTML5中废除的元素 124
本章小结 125
Chapter 08 HTML5进阶——无处不在的应用 127
8.1 画布功能 127
8.1.1 canvas元素 127
8.1.2 canvas坐标 128
8.1.3 canvas绘制路径 128
8.1.4 canvas渐变 130
8.1.5 canvas文本 132
8.2 音频和视频 134
8.2.1 audio元素 134
8.2.2 video元素 137
8.3 表单功能 138
8.3.1 form新特性 139
8.3.2 输入型控件 139
8.3.3 form新元素 141
8.3.4 form新属性 143
8.3.5 form练习 147
8.4 拖放功能 149
8.4.1 dataTransfer属性 149
8.4.2 拖放列表 150
8.5 地理位置 153
8.5.1 geolocation概述 153
8.5.2 geolocation浏览器支持检测 155
8.5.3 在地图上显示你的位置 157
8.6 本地存储 159
8.6.1 WebStorage介绍 159
8.6.2 executeSql执行查询 161
本章小结 164
Chapter 09 美化网页——CSS样式 166
9.1 CSS概述 166
9.1.1 CSS基本语法 166
9.1.2 CSS特点 167
9.1.3 使用CSS 167
9.2 CSS选择器 169
9.2.1 元素选择器 169
9.2.2 类选择器 170
9.2.3 id选择器 172
9.2.4 集体选择器 173
9.2.5 属性选择器 174
9.2.6 伪类 176
9.2.7 伪元素 178
9.3 CSS定位 180
9.3.1 浮动定位 180
9.3.2 相对定位 183
9.3.3 绝对定位 184
9.4 盒子模型 186
9.4.1 盒子简介 186
9.4.2 设置外边距 186
9.4.3 设置内边距 190
9.5 字体样式 191
9.5.1 font-family字体 191
9.5.2 font-size字号 192
9.5.3 font-style字体风格 193
9.5.4 font-weight加粗字体 195
9.6 段落样式 196
9.6.1 letter-spacing字符间隔 196
9.6.2 word-spacing单词间隔 197
9.6.3 text-indent段落缩进 198
9.6.4 line-height文本行间距 200
9.6.5 text-align横向对齐 201
9.6.6 vertical-align纵向对齐 202
9.7 边框样式 204
9.7.1 border-style边框线型 204
9.7.2 border-color边框颜色 205
9.7.3 border-width边框宽度 206
9.7.4 border边框练习 206
9.8 轮廓样式 208
9.8.1 outline-style边框线型 208
9.8.2 outline-color边框颜色 209
9.8.3 outline-width边框宽度 210
9.8.4 outline与border的异同点 212
9.9 列表标记样式 213
9.9.1 list-style-type列表标记样式 213
9.9.2 list-style-image列表标记图像 216
9.9.3 list-style-position列表标记的位置 218
9.9.4 list-style列表简写格式 219
本章小结 220
Chapter 10 超级网页——CSS3样式表的应用 222
10.1 CSS3概述 222
10.1.1 CSS3与CSS的异同 222
10.1.2 CSS3浏览器的支持情况 222
10.2 CSS3的新增功能 223
10.2.1 CSS3新增的rem 223
10.2.2 新增结构性伪类 224
10.2.3 新增UI元素状态伪类 229
10.2.4 新增属性和其他 231
10.3 CSS3文本样式 234
10.3.1 text-shadow文本阴影 234
10.3.2 text-overflow文本溢出 236
10.3.3 word-wrap文本换行 237
10.3.4 word-break单词拆分 239
10.4 CSS3边框样式 240
10.4.1 border-radius圆角边框 240
10.4.2 box-shadow盒子阴影 241
10.5 CSS3背景样式 243
10.5.1 background-size背景尺寸 243
10.5.2 background-origin背景的绘制区域 244
10.6 CSS3渐变 246
10.6.1 线性渐变 246
10.6.2 径向渐变 249
10.7 CSS3转换 251
10.7.1 2D转换 251
10.7.2 3D转换 258
10.8 CSS3动画 264
10.8.1 动画属性 264
10.8.2 实现动画 266
10.9 CSS3多列布局 269
10.10 CSS3过渡 273
10.10.1 单项属性过渡 273
10.10.2 多项属性过渡 274
本章小结 276
Chapter 11 知识拓展——XML的应用 278
11.1 XML入门 278
11.1.1 什么是XML 278
11.1.2 XML用途 278
11.1.3 XML文件结构 279
11.1.4 使用XSLT显示XML 280
11.2 XML进阶 281
11.2.1 命名空间 281
11.2.2 将数据存储到XML文件 284
11.2.3 现实案例 287
本章小结 287
Chapter 12 网页特效——JavaScript必会基础 289
12.1 JavaScript简介 289
12.2 JavaScript的基本元素 290
12.2.1 数据类型 290
12.2.2 常量和变量 293
12.2.3 运算符和表达式 293
12.3 JavaScript事件分析 300
12.3.1 事件类型 301
12.3.2 事件句柄 302
12.3.3 事件处理 303
12.4 表单事件 305
12.4.1 提交事件 305
12.4.2 重置表单 306
12.5 鼠标事件 307
12.5.1 鼠标单、双击事件 307
12.5.2 鼠标移动事件 309
12.6 键盘事件 310
12.7 窗口事件 311
本章小结 312
Chapter 13 典型应用——使用JavaScript制作特效 314
13.1 JavaScript事件分析 314
13.1.1 轮播图效果 314
13.1.2 图片闪烁效果 319
13.1.3 当鼠标滑过时图片震动效果 320
13.2 窗口特效 322
13.2.1 定时关闭窗口 322
13.2.2 全屏显示窗口 322
13.3 时间特效 323
13.3.1 显示网页停留时间 323
13.3.2 显示当前日期 325
本章小结 326
Chapter 14 综合实例——商业类网页的制作 328
14.1 商业网站功能分析 328
14.2 头部和banner的制作 329
14.2.1 头部内容的结构分析 329
14.2.2 banner的制作 330
14.3 页面主体的制作 332
14.3.1 主体内容结构分析 332
14.3.2 主体内容样式定义 334
14.4 页面尾部的制作 335
14.5 网站首页代码实例 336
14.6 二级页面的制作 340
本章小结 345
Chapter 15 综合实例——网店类网页的制作 347
15.1 网店类网页介绍 347
15.1.1 网店类网页的作用 347
15.1.2 网店类网页的构成及特点 347
15.2 界面设计分析 347
15.2.1 头部内容结构分析 348
15.2.2 对整体样式进行定义 349
15.2.3 对头部内容进行样式定义 350
15.2.4 对网站Logo进行样式定义 351
15.2.5 对网站工具栏进行样式定义 351
15.2.6 对网站广告进行样式定义 353
15.3 页面主体的制作 354
15.3.1 主体内容结构分析 354
15.3.2 对搜索栏进行样式定义 355
15.3.3 对商品列表进行样式定义 357
15.3.4 对用户登录、商品部分进行样式定义 359
15.3.5 对商品展示进行样式定义 362
15.4 对底部内容进行样式定义 364
15.4.1 对支付方式进行制作 364
15.4.2 制作新闻部分内容 365
15.4.3 页尾的内容制作 367
15.5 二级页面的制作 376
本章小结 380