CSS世界_前端开发教程

资源名称：CSS世界

内容简介：

本书从前端开发人员的需求出发，以“流”为线索，从结构、内容到美化装饰等方面，全面且深入地讲解前端开发人员必须了解和掌握的大量的CSS知识点。同时，作者结合多年的从业经验，通过大量的实战案例，详尽解析CSS的相关知识与常见问题。作者还为本书开发了专门的配套网站，进行实例展示、问题答疑。

作为一本CSS深度学习的书，书中介绍大量许多前端开发人员都不知道的CSS知识点。通过阅读本书，读者会对CSS世界的深度和广度有一个全新的认识。

作者简介：

张鑫旭，前端开发工程师，国内知名前端博客“鑫空间-鑫生活”博主，目前就职于阅文集团用户体验设计部（YUX），担任技术经理。2007年开始接触前端，10年来一直工作在前端开发一线，在HTML/CSS等与交互体验关系密切的领域花了大量的时间学习和研究，有比较多的心得体会。

资源目录：

第 1章　概述 1

1．1 CSS世界的“世界观” 1

1．2 世界都是创造出来的 3

1．3 CSS完胜SVG的武器—流 4

1．3．1 何为“流” 5

1．3．2　流是如何影响整个CSS世界的 6

1．3．3 什么是流体布局 6

1．4 CSS世界的开启从IE8开始 6

1．5 table自己的世界 7

1．6 CSS新世界—CSS3 7

第 2章　需提前了解的术语和概念 8

2．1 务必了解的CSS世界的专业术语 8

2．2 了解CSS世界中的“未定义行为” 11

第3章　流、元素与基本尺寸 13

3．1 块级元素 13

3．1．1 为什么list-item元素会出现项目符号 15

3．1．2 display：inline-table的盒子是怎样组成的 16

3．1．3 width/height作用在哪个盒子上 16

3．2 width/height作用的具体细节 16

3．2．1 深藏不露的width：auto 17

3．2．2 width值作用的细节 24

3．2．3 CSS流体布局下的宽度分离原则 27

3．2．4 改变width/height作用细节的box-sizing 29

3．2．5 相对简单而单纯的height：auto 33

3．2．6 关于height：100% 33

3．3 CSS min-width/max-width和min-height/max-height二三事 37

3．3．1 为流体而生的min-width/max-width 38

3．3．2 与众不同的初始值 38

3．3．3 超越!important 39

3．3．4 任意高度元素的展开收起动画技术 40

3．4 内联元素 42

3．4．1 哪些元素是内联元素 42

3．4．2 内联世界深入的基础—内联盒模型 42

3．4．3 幽灵空白节点 44

第4章　盒尺寸四大家族 45

4．1 深入理解content 45

4．1．1 content与替换元素 45

4．1．2 content内容生成技术 57

4．2 温和的padding属性 73

4．2．1 padding与元素的尺寸 73

4．2．2 padding的百分比值 77

4．2．3 标签元素内置的padding 79

4．2．4 padding与图形绘制 80

4．3 激进的margin属性 81

4．3．1 margin与元素尺寸以及相关布局 82

4．3．2 margin的百分比值 87

4．3．3 正确看待CSS世界里的margin合并 87

4．3．4 深入理解CSS中的margin：auto 94

4．3．5 margin无效情形解析 97

4．4 border属性 100

4．4．1 为什么border-width不支持百分比值 100

4．4．2 了解各种border-style类型 101

4．4．3 border-color和color 105

4．4．4 border与透明边框技巧 106

4．4．5 border与图形构建 108

4．4．6 border等高布局技术 109

第5章　内联元素与流 111

5．1 字母x—CSS世界中隐匿的举足轻重的角色 111

5．1．1 字母x与CSS世界的基线 111

5．1．2 字母x与CSS中的x-height 112

5．1．3 字母x与CSS中的ex 113

5．2 内联元素的基石line-height 114

5．2．1 内联元素的高度之本—line-height 114

5．2．2 为什么line-height可以让内联元素“垂直居中” 119

5．2．3 深入line-height的各类属性值 121

5．2．4 内联元素line-height的“大值特性” 124

5．3 line-height的好朋友vertical-align 126

5．3．1 vertical-align家族基本认识 127

5．3．2 vertical-align作用的前提 129

5．3．3 vertical-align和line-height之间的关系 131

5．3．4 深入理解vertical-align线性类属性值 135

5．3．5 深入理解vertical-align文本类属性值 141

5．3．6 简单了解vertical-align上标下标类属性值 142

5．3．7 无处不在的vertical-align 143

5．3．8 基于vertical-align属性的水平垂直居中弹框 144

第6章　流的破坏与保护 147

6．1 魔鬼属性float 147

6．1．1 float的本质与特性 147

6．1．2 float的作用机制 151

6．1．3 float更深入的作用机制 154

6．1．4 float与流体布局 155

6．2 float的天然克星clear 157

6．2．1 什么是clear属性 157

6．2．2 成事不足败事有余的clear 158

6．3 CSS世界的结界—BFC 160

6．3．1 BFC的定义 160

6．3．2 BFC与流体布局 160

6．4 结界overflow 164

6．4．1 overflow剪裁界线border box 165

6．4．2 了解overflow-x和overflow-y 166

6．4．3 overflow与滚动条 166

6．4．4 依赖overflow的样式表现 169

6．4．5 overflow与锚点定位 170

6．5 float的兄弟position：absolute 177

6．5．1 absolute的包含块 178

6．5．2 具有相对特性的无依赖absolute定位 184

6．5．3 absolute与text-align 191

6．6 absolute与overflow 193

6．7 absolute与clip 195

6．7．1 重新认识的clip属性 196

6．7．2 深入了解clip的渲染 198

6．8 absolute的流体特性 199

6．8．1 当absolute遇到left/top/right/bottom属性 199

6．8．2 absolute的流体特性 200

6．8．3 absolute的margin：auto居中 202

6．9 position：relative才是大哥 202

6．9．1 relative对absolute的限制 203

6．9．2 relative与定位 203

6．9．3 relative的zui小化影响原则 206

6．10 强悍的position：fixed固定定位 207

6．10．1 position：fixed不一样的“包含块” 207

6．10．2 position：fixed的absolute模拟 208

6．10．3 position：fixed与背景锁定 209

第7章　CSS世界的层叠规则 211

7．1 z-index只是CSS层叠规则中的一叶小舟 211

7．2 理解CSS世界的层叠上下文和层叠水平 212

7．2．1 什么是层叠上下文 212

7．2．2 什么是层叠水平 212

7．3 理解元素的层叠顺序 212

7．4 务必牢记的层叠准则 214

7．5 深入了解层叠上下文 214

7．5．1 层叠上下文的特性 214

7．5．2 层叠上下文的创建 214

7．5．3 层叠上下文与层叠顺序 217

7．6 z-index负值深入理解 219

7．7 z-index“不犯二”准则 223

第8章　强大的文本处理能力 225

8．1 line-height的另外一个朋友font-size 225

8．1．1 font-size和vertical-align的隐秘故事 225

8．1．2 理解font-size与ex、em和rem的关系 227

8．1．3 理解font-size的关键字属性值 229

8．1．4 font-size：0与文本的隐藏 231

8．2 字体属性家族的大家长font-family 232

8．2．1 了解衬线字体和无衬线字体 233

8．2．2 等宽字体的实践价值 234

8．2．3 中文字体和英文名称 236

提示： 本文由神整理自网络，如有侵权请联系本站删除！
本站声明：
1、本站所有资源均来源于互联网，不保证100%完整、不提供任何技术支持；
2、本站所发布的文章以及附件仅限用于学习和研究目的;不得将用于商业或者非法用途；否则由此产生的法律后果，本站概不负责！

下载资源