第一部分 基础回顾
第1章 层叠、优先级和继承
1.1 层叠
1.1.1 样式表的来源
1.1.2 理解优先级
1.1.3 源码顺序
1.1.4 两条经验法则
1.2 继承
1.3 特殊值
1.3.1 使用inherit关键字
1.3.2 使用initial关键字
1.4 简写属性
1.4.1 简写属性会默默覆盖其他样式
1.4.2 理解简写值的顺序
1.5 总结
第2章 相对单位
2.1 相对值的好处
2.1.1 那些年追求的像素级完美
2.1.2 像素级完美的时代终结了
2.2 em和rem
2.2.1 使用em定义字号
2.2.2 使用rem设置字号
2.3 停止像素思维
2.3.1 设置一个合理的默认字号
2.3.2 构造响应式面板
2.3.3 缩放单个组件
2.4 视口的相对单位
2.4.1 使用vw定义字号
2.4.2 使用calc()定义字号
2.5 无单位的数值和行高
2.6 自定义属性(即CSS变量)
2.6.1 动态改变自定义属性
2.6.2 使用JavaScript改变自定义属性
2.6.3 探索自定义属性
2.7 总结
第3章 盒模型
3.1 元素宽度的问题
3.1.1 避免魔术数值
3.1.2 调整盒模型
3.1.3 全局设置border-box
3.1.4 给列之间加上间隔
3.2 元素高度的问题
3.2.1 控制溢出行为
3.2.2 百分比高度的备选方案
3.2.3 使用min-height和max-height
3.2.4 垂直居中内容
3.3 负外边距
3.4 外边距折叠
3.4.1 文字折叠
3.4.2 多个外边距折叠
3.4.3 容器外部折叠
3.5 容器内的元素间距
3.5.1 如果内容改变了
3.5.2 更通用的解决方案:猫头鹰选择器
3.6 总结
第二部分 精通布局
第4章 理解浮动
4.1 浮动的设计初衷
4.2 容器折叠和清除浮动
4.2.1 理解容器折叠
4.2.2 理解清除浮动
4.3 出乎意料的“浮动陷阱”
4.4 媒体对象和BFC
4.4.1 BFC
4.4.2 使用BFC实现媒体对象布局
4.5 网格系统
4.5.1 理解网格系统
4.5.2 构建网格系统
4.5.3 添加间隔
4.6 总结
第5章 Flexbox
5.1 Flexbox的原则
5.1.1 创建一个基础的Flexbox菜单
5.1.2 添加内边距和间隔
5.2 弹性子元素的大小
5.2.1 使用flex-basis属性
5.2.2 使用flex-grow属性
5.2.3 使用flex-shrink属性
5.2.4 实际应用
5.3 弹性方向