第1章 概述及任务介绍 1
1.1 为什么需要响应式设计 1
1.1.1 产品形态需要 1
1.1.2 性能与商业考虑 3
1.2 本书的线索 3
1.3 写作思路 4
1.4 定义响应式 5
1.5 本书任务 6
第2章 响应式中要面对的问题 9
2.1 像素密度 9
2.2 CSS像素 14
2.3 视口 17
2.3.1 桌面浏览器的视口 17
2.3.2 移动设备浏览器的视口 18
2.3.3 设备宽度 20
小结 21
第3章 布局 23
3.1 写在编码前的话 23
3.1.1 写出好的代码 24
3.1.2 代码的浏览器适配问题 25
3.1.3 仰望星空与脚踏实地 26
3.2 全局样式 27
3.3 无懈可击的导航栏 30
3.3.1 桌面端 30
3.3.2 移动端导航栏 37
小结 40
第4章 布局——响应式篇 41
4.1 媒体查询 41
4.1.1 为什么需要媒体查询 41
4.1.2 什么是媒体查询 44
4.1.3 媒体查询中的逻辑 45
4.1.4 媒体查询的策略 46
4.1.5 导航栏与媒体查询 51
4.1.6 polyfill 56
4.2 伸缩布局 58
4.2.1 为什么需要伸缩布局 58
4.2.2 快速入门 58
4.2.3 基本应用 60
4.2.4 回归导航栏flexbox.css 62
4.3 相对单位 63
4.3.1 相对单位em 65
4.3.2 相对单位rem 67
4.3.3 如何使用这几种单位 68
4.4 标题布局 70
4.4.1 背景 71
4.4.2 文字居中 73
4.5 响应式文字 79
4.5.1 标题 79
4.5.2 正文内容 83
小结 89
第5章 响应式图片 91
5.1 万能的100% 91
5.2 响应式图用例 93
5.3 srcset语法 96
5.3.1 移动优先或桌面优先 97
5.3.2 计划赶不上变化 98
5.3.3 家长式管理 99
5.4 元素 99
5.4.1 sizes 99
5.4.2 元素和元素 102
5.4.