深入行内元素
基线
字母x的下边缘是CSS中的基线 x-height：指的就是小写字母x的高度 middle指的是基线1/2 x-height的高度 对于行内元素垂直居中应该是对文字，而非居外部的块级容器所言 行内元素默认是基线对齐
深入行高line-height
div标签的高度不是通过文字撑开，本质上由line-height属性全权决定的 对于非替换元素的纯行内元素，其可视高度完全由line-height决定，padding、border也不好使 line-height不会影响替换元素的高度
line-height可以让行内元素垂直居中的原因
原因：CSS中行距上下等分 误区1：line-height垂直居中需要和height一致，其实只设置line-height就可以(我也中过招)，举例证明
<div class="title">哈哈哈</div>
.title {
line-height: 150px;
background-color: blue;
color: white;
}
误区2：行高控制文字垂直居中，不仅适用于单行，多行也可以
这种垂直居中只是近似，因为文字字形的垂直中线位置普遍要比真正的行框盒子的垂直中线位置低
深入line-height的属性值
line-height的默认值是normal，还支持数值、百分比值和长度值 如果使用数值作为line-height的属性值，那么所有的子元素继承的都是这个值，但是如果使用是百分比值或者长度值作为属性值，那么所有的子元素继承的是最终的计算值。 大值特性：无论是行内元素line-height如何设置，最终父级元素的高度都是由数组大的那个line-height决定
vertical-align
凡是line-height起作用的地方vertical-align也一定起作用 vertical-align属性值分为4类： 线类：如baseline、top 文本类：如text-top、text-bottom 上标下标类：如sub、super 数组百分比类：如10px、20% vertical-align的默认值是baseline，基线也就是之前提到的x的下边缘
文档流
float属性
浮动的本质是为了文字环绕。 float缺少弹性，容错性很低，应尽可能少使用浮动，应尽可能使用CSS流动性和自适应性的特征 float的容错性差主要是由于它自身的特性：包裹、块状化并格式化上下文、破坏文档流、无任何margin合并 float会让父元素高度塌陷
clear属性
clear属性的并不是清除浮动，官方文档的解释是：元素盒子的边不能和前面的浮动元素相邻。 注意：clear属性只是对于前面，不对后面的元素 当clear：left有效，则clear：right必定无效，反过来也一样，直接可以等同于clear：both clear属性只有块级元素才有效
overflow属性
彻底清除浮动影响最适合的属性是overflow：hidden overflow：hidden声明不会影响元素原先的流体特性或者宽度 overflow与滚动条：HTML中有两个标签是默认可以产生滚动条，一个是跟元素html标签、另一个是文本域textarea标签 overflow: hidden 即可隐藏默认滚动条，一般情况下在html标签设置即可 滚动条会占用容器的可用宽度或者高度
深入position：absolute
position：absolute也具有破坏文档流的特点 元素的position属性值为absolute或者fixed，其display的计算值就是block或者table 绝对定位元素的宽度是相对第一个position不为static的祖先元素计算的 包含块：如width：50%也就是宽度的一半，这个宽度的一半 就是相对于包含块的宽度 根元素被称为初始包含块，其尺寸等同于浏览器可视窗口的大小 绝对定位元素默认的最大宽度就是包含块的宽度 absolute是非常独立的CSS属性值，其样式和行为表现不依赖其他任何CSS属性就可以完成 绝对定位元素不总是被父级overflow属性裁剪，尤其当overflow在绝对定位元素及其包含块之间的时候 当absolute遇到left/top/right/bottom属性的时候，absolute属性才能把元素变为绝对定位元素
深入position：relative
relative的定位有两大特性：一是相对自身，二是无侵入 无侵入的意思是，当relative进行定位偏移的时候，一般情况下不会影响周围元素的布局 相对定位元素的left/top/right/bottom的百分比值是相对于包含块计算的，位移是相当于自身的 relative最小化影响原则： 1、尽量不使用relative，如果想定位某些元素，应首先尝试无依赖的绝对定位 2、如果场景受限，一定要使用relative，则该relative务必最小化
