从0到1 CSS进阶之旅

作者
莫振杰
丛书名
出版社
人民邮电出版社
ISBN
9787115535900
简要
简介
内容简介书籍计算机书籍 《从0到1:CSS进阶之旅》作者根据自己多年的前后端开发经验,详尽介绍了CSS的进阶知识和高级开发技巧。 本书的正文部分共12章,分别讲解了CSS的基础知识、CSS规范、盒子模型、display属性、文本效果、表单效果、浮动布局、定位布局、CSS图形、性能优化、CSS技巧,以及CSS的一些重要概念。除了正文部分,本书还包括两个附录,附录1介绍了HTML的进阶知识,附录2是作者结合实际工作和前端面试经验,精心挑选的前端面试题。 本书还配备了所有案例的源代码和PPT教学课件,以方便学校老师教学。本书适合作为前端开发人员的参考书,也可以作为大中专院校相关专业的教材及教学参考书。
目录



第 1 章 基础知识 1


1.1 CSS 进阶简介 1


1.1.1 你真的精通CSS 吗 1


1.1.2 进阶教程简介 2


1.2 CSS 单位 3


1.2.1 绝对单位 3


1.2.2 相对单位 3


1.3 CSS 特性 11


1.3.1 继承性 11


1.3.2 层叠性 13


1.4 CSS 优先级 15


1.4.1 引用方式冲突 15


1.4.2 继承方式冲突 16


1.4.3 指定样式冲突 16


1.4.4 继承样式和指定样式冲突 19


1.4.5 !important 20


1.5 CSS 引用方式 22


1.5.1 外部样式表 23


1.5.2 内部样式表 23


1.5.3 行内样式表 24


1.6 CSS 选择器 25


1.6.1 后代选择器 26


1.6.2 子代选择器 27


1.6.3 兄弟选择器 28


1.6.4 相邻选择器 29


1.7 :first-letter 和:first-line 32


1.7.1 :first-letter 选择器 32


1.7.2 :first-line 选择器 32


第 2 章 CSS 规范 34


2.1 CSS 规范简介 34


2.2 命名规范 34


2.2.1 CSS 文件命名 35


2.2.2 id 和class 命名 35


2.3 书写规范 38


2.4 注释规范 40


2.4.1 顶部注释 40


2.4.2 模块注释 40


2.4.3 简单注释 41


2.5 CSS reset 41


2.5.1 什么是CSS reset 41


2.5.2 为什么要用CSS reset 42


2.5.3 如何使用CSS reset 42


第3 章 盒子模型 45


3.1 CSS 盒子模型 45


3.2 深入border 48


3.2.1 性能差异 48


3.2.2 兼容差异 48


3.3 深入padding 48


3.4 外边距叠加 50


3.4.1 外边距叠加的3 种情况 51


3.4.2 外边距叠加的意义 53


3.5 负margin 技术 54


3.5.1 负margin 简介 54


3.5.2 负margin 技巧 57


3.6 overflow 64


第4 章 display 属性 67


4.1 块元素和行内元素 67


4.1.1 块元素 67


4.1.2 行内元素 68


从0 到2 1 系列图书


4.2 display 简介 69


4.2.1 block 元素 69


4.2.2 inline 元素 70


4.2.3 inline-block 元素 70


4.3 display:none 72


4.3.1 display:none 简介 72


4.3.2 display:none 和visibility:hidden 的


区别 73


4.4 display:table-cell 75


4.4.1 图片垂直居中于元素 75


4.4.2 等高布局 77


4.4.3 自动平均划分元素 79


4.5 去除inline-block 元素间距 80


第5 章 文本效果 84


5.1 文本效果简介 84


5.2 深入text-indent 84


5.3 text-align 87


5.3.1 text-align 起作用的元素 88


5.3.2 text-align:center; 与margin:0


auto; 89


5.4 深入line-height 89


5.4.1 line-height 的定义 90


5.4.2 深入line-height 91


5.5 深入vertical-align 97


5.5.1 vertical-align 属性取值 97


5.5.2 vertical-align 属性应用 99


第6 章 表单效果 104


6.1 表单效果简介 104


6.2 深入radio 和checkbox 105


6.3 深入textarea 106


6.3.1 固定大小,禁用拖动 106


6.3.2 在Chrome(或Firefox)和IE 中


实现相同的外观 109


6.4 表单对齐 110


第7 章 浮动布局 113


7.1 正常文档流和脱离文档流 113


7.1.1 正常文档流 113


7.1.2 脱离文档流 114


7.2 深入浮动 116


7.3 浮动的影响 118


7.3.1 对自身的影响 119


7.3.2 对父元素的影响 119


7.3.3 对兄弟元素的影响 121


7.3.4 对子元素的影响 125


7.4 浮动的副作用 126


7.5 清除浮动 128


7.5.1 clear:both 128


7.5.2 overflow:hidden 130


7.5.3 ::after 伪元素 131


第8 章 定位布局 133


8.1 深入定位 133


8.1.1 子元素相对父元素定位 133


8.1.2 子元素相对祖先元素定位 136


8.2 z-index 属性 138


第9 章 CSS 图形 141


9.1 CSS 图形简介 141


9.2 三角形 142


9.2.1 CSS 实现三角形的原理 142


9.2.2 带边框的三角形 145


9.3 圆角与圆 148


9.3.1 border-radius 实现圆角 148


9.3.2 border-radius 实现半圆和圆 152


9.3.3 border-radius 的派生子属性 154


9.4 椭圆 155


9.5 图标制作 156


第 10 章 性能优化 164


10.1 CSS 优化简介 164


从0 到1 系列图书  3


10.2 属性简写 165


10.2.1 盒模型简写 165


10.2.2 背景简写 167


10.2.3 字体简写 168


10.2.4 颜色值简写 168


10.3 语法压缩 169


10.3.1 空白符 169


10.3.2 结尾分号 169


10.3.3 url() 的引号 170


10.3.4 属性值为0 170


10.3.5 属性值为“以0 开头的小数” 171


10.3.6 合并相同的定义 171


10.3.7 利用继承进行合并 172


10.4 压缩工具 173


10.5 图片压缩 174


10.5.1 JPEG、PNG 和GIF 175


10.5.2 图片压缩 175


10.6 高性能选择器 175


10.6.1 选择器在浏览器中的解析原理 176


10.6.2 不同选择器的解析速度 176


第 11 章 CSS 技巧 178


11.1 水平居中 178


11.1.1 文本的水平居中 178


11.1.2 元素的水平居中 179


11.2 垂直居中 183


11.2.1 文本的垂直居中 183


11.2.2 元素的垂直居中 185


11.3 CSS Sprite 188


11.4 iconfont 图标 192


11.4.1 iconfont 网站 193


11.4.2 iconfont 技术 195


第 12 章 重要概念 202


12.1 CSS 中的重要概念 202


12.2 包含块(containing block) 202


12.2.1 什么是包含块 202


12.2.2 包含块的判定以及包含块的范围 203


12.3 层叠上下文(stacking context) 206


12.3.1 什么是层叠上下文 207


12.3.2 什么是层叠级别 207


12.3.3 层叠上下文的特点 208


12.4 BFC 和IFC 210


12.4.1 基本概念 210


12.4.2 什么是BFC 211


12.4.3 BFC 的用途 213


附录1 HTML 进阶


第13 章 基础知识 222


13.1 HTML、XHTML 和HTML5 222


13.1.1 HTML 和XHTML 222


13.1.2 HTML5 223


13.2 div 和span 225


13.3 id 和class 226


13.3.1 id 属性 226


13.3.2 class 属性 226


13.4 浏览器标题栏小图标 227


第 14 章 语义化 229


14.1 语义化简介 229


14.2 标题语义化 231


14.3 图片语义化 232


14.3.1 alt 属性和title 属性 233


14.3.2 figure 元素和figcaption 元素 233


14.4 表格语义化 236


14.5 表单语义化 239


14.5.1 label 标签 239


从0 到4 1 系列图书


14.5.2 fieldset 标签和legend 标签 241


14.6 其他语义化 242


14.6.1 换行符
242


14.6.2 无序列表ul 243


14.6.3 strong 标签和em 标签 244


14.6.4 del 标签和ins 标签 245


14.6.5 img 标签 246


14.7 语义化验证 246


14.8 HTML5 舍弃的标签 248


附录2 前端面试题


选择题 251


问答题 257





有问题微信扫码联系

推荐

Understand China
桂ICP备20004708号-4