第1章 了解HTML 1
1.1为什么要学习HTML？ 2
1.1.1 HTML使得因特网更受欢迎 2
1.1.2学习HTML，更好地理解网页设计 2
1.1.3学习HTML很容易 2
1.2HTML编程基础 4
1.2.1文本编辑器 4
1.2.2文字处理软件不是文本编辑器 4
1.2.3用HTML编写代码 5
1.3构建网页 6
1.3.1指定DOCTYPE 6
1.3.2保存和查看页面 9
1.4布置页面内容 10
1.4.1HTML标题 10
1.4.2HTML文本标签 10
1.4.3为网站创建链接 12
1.4.4添加title属性 12
1.4.5网站的链接 13
1.5总结 15
第2章 使用CSS设置样式 17
2.1 CSS来帮忙 18
2.2初识样式 18
2.2.1声明 18
2.2.2选择器 19
2.2.3更多的CSS选择器 19
2.3添加CSS格式 20
2.3.1链接到CSS 21
2.3.2内联样式 22
2.4块和行内格式化 23
2.4.1HTML的通用元素 24
2.4.2伪类和伪元素 25
2.5专门为IE写CSS 27
2.6常规流和定位 29
2.6.1静态文本流（static） 29
2.6.2固定定位（fixed） 29
2.6.3相对定位（relative） 29
2.6.4绝对定位（absolute） 30
2.7总结 33
第3章 网页排版 35
3.1网页字体 36
3.1.1 size属性和值 38
3.1.2那么，你应该使用什么测量值呢？ 39
3.1.3粗细、样式、变形和修饰 40
3.2网页安全字体实践 42
3.2.1网页安全字体 42
3.2.2移动安全字体 43
3.3制作更好的字体栈 44
3.4网页中的“Real Fonts” 45
3.4.1@font-face属性 46
3.4.2生成嵌入文件 47
3.4.3免费字体 48
3.4.4商业字体 50
3.5总结 53
第4章 网页设计中的挑战 55
4.1网络环境 56
4.1.1揭示浏览器问题 56
4.1.2使用测试页 58
4.1.3颜色 58
4.1.4屏幕和像素 59
4.1.5可访问性 59
4.2决定你的跨浏览器目标 61
4.3针对不同设备开发网站 65
4.3.1重置和标准化浏览器样式 65
4.3.2特殊前缀 67
4.3.3检验 68
4.3.4测试 70
4.4总结 71
第5章 网页中的颜色 73
5.1网页颜色编码 74
5.1.1十六进制颜色标记 74
5.1.2重写HTML的默认颜色 74
5.1.3图像边框 75
5.1.4带透明度的CSS颜色 76
5.2颜色属性 76
5.3原色系统 77
5.4颜色组合 78
5.5构建配色方案 79
5.5.1寻找基色 79
5.5.2文化与颜色 81
5.5.3浏览颜色的启示 82
5.5.4构思方案 84
5.6一致的颜色 85
5.6.1校正颜色 86
5.6.2拾取颜色 86
5.7 CSS颜色表 86
5.8总结 91
第6章 网站图像 93
6.1位数的问题 94
6.1.1像素深度 94
6.1.2色调分离和抖动 94
6.1.3更多位意味着更多颜色 94
6.1.4为什么位深度如此重要？ 95
6.2光栅图像格式 97
6.2.1 GIF图像格式 97
6.2.2 JPEG图像格式 98
6.2.3 PNG图像格式 99
6.3图像压缩表 100
6.4 SVG：网页中的矢量文件 106
6.5总结 107
第7章 为网页创建图像 109
7.1使用Illustrator 110
7.1.1为网页设置工作区 110
7.1.2设置文档尺寸 111
7.1.3导出光栅图像 114
7.1.4使用Illustrator导出矢量图像 116
7.2使用Photoshop 117
7.2.1新建文档 117
7.2.2导出光栅图像 117
7.3管理Web图像文件 118
7.4减小文件尺寸 119
7.4.1压缩光栅图像 119
7.4.2使用HTTP压缩 120
7.5总结 123
第8章 透明度和阴影 125
8.1使用GIF图像创造透明度 126
8.1.1杂边 127
8.2 PNG半透明图像 128
8.2.1 8位PNG 128
8.2.2 24位PNG 129
8.3 CSS透明度 129
8.3.1圆角 130
8.3.2图像蒙版 130
8.3.3元素透明 131
8.3.4背景色透明度 132
8.3.5文本阴影 132
8.3.6 3D文本阴影 133
8.3.7盒阴影 133
8.4总结 135
第9章 收藏夹图标和移动书签 137
9.1收藏夹图标在哪里 138
9.2收藏夹图标的图像格式 139
9.3将收藏夹图标插入到网站中 139
9.3.1为子网站设定收藏夹图标 139
9.3.2推广收藏夹图标 140
9.4为网页创建收藏夹图标 140
9.5移动书签 144
9.5.1文件格式 144
9.5.2命名规范 144
9.5.3自动图像处理 145
9.5.4插入图标 145
9.6混合收藏夹图标与移动书签 146
9.7总结 147
第10章 列表和图标字体 149
10.1无序列表 150
10.1.1 CSS项目符号图标 150
10.1.2插入定制图标 151
10.2定义列表 151
10.3有序列表 152
10.3.1改变顺序 153
10.3.2设置目录 153
10.3.3添加有序标记的另一种写法 154
10.4高效列表设计 156
10.5图标字体 158
10.5.1选择一种图标字体 159
10.5.2突出字符或者短语 160
10.5.3创建可点击的单独图标 161
10.6总结 163
第11章 图像映射 165
11.1创造图像映射 166
11.1.1基础的手工编码 166
11.1.2使用Fireworks 168
11.2响应式图像映射 170
11.3总结 171
第12章 页面布局 173
12.1 CSS浮动 174
12.1.1 float属性 174
12.1.2多重浮动 175
12.1.3 clear属性 175
12.2浮动页面布局 176
12.2.1页面结构 176
12.2.2两栏流式布局 178
12.2.3两栏固定布局 179
12.2.4三栏流式布局 181
12.2.5三栏固定布局 182
12.2.6使用浮动布局的优缺点 184
12.3 CSS框架 184
12.3.1网格系统 184
12.3.2最后看看框架 187
12.4响应式布局 188
12.4.1适应媒体查询 189
12.4.2流式布局 190
12.4.3文本回流 192
12.4.4媒体查询实战 193
12.4.5响应式框架 199
12.5总结 199
第13章 响应Web设计中的图像 201
13.1缩放图像和媒体 202
13.2缩放图像带来的问题 202
13.2.1大尺寸图像 203
13.2.2更大尺寸的图像 203
13.2.3把网速考虑进来 204
13.3自适应图像解决方案 204
13.3.1另寻他法 204
13.3.2压缩Retina图像 205
13.4多图像解决方案 208
13.4.1 picture元素 208
13.4.2 srcset属性 209
13.4.3使用图像补丁脚本 210
13.5总结 217
第14章 对齐图像 219
14.1图像与文本的对齐 220
14.1.1 baseline 220
14.1.2 text-bottom 220
14.1.3 text-top 221
14.1.4 top和bottom 221
14.1.5 middle 222
14.2在浏览器窗口中居中图像 222
14.2.1使用CSS设置背景 222
14.2.2仅用CSS 223
14.2.3幸亏有jQuery，我们不用把数字写死了 224
14.3在浏览器中伸展图像 225
14.4总结 226