响应式Web图形设计 彩印PDF电子书下载

第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