万恶的bug之源
- height：100px 固定高度
- width: 100% 宽度百分之百
1高度是由什么决定的
- 内联元素
- 块级元素
div高度由其内部文档流元素的高度总和决定
什么是文档流：文档内元素流动方向
内联元素从左往右流动，流动遇到阻碍就换行流动
如果是块级元素，每个块级元素独占一行，从上往下流
span 高度
baseline
line-hight
image.png
给span里面的字体设置font-size为100px，这里的fontsize是指字母最高的高度到最低的高度之间有100px, 但是span的高度并不是100px,span的高度将会是浏览器提供的推荐行高line-height,比如说，此时line-height为fontsize的1.4倍，那么span行高就为140px，所以说，line-height是根据fontsize决定的。
多个span元素排列在一起的时候，是按照基线baseline排列的
脱离文档流
1.position：fixed
（有bug会导致原本占一行块级元素收缩）
2.position：absolute
2.line-box 是啥
inline box是我们平时所说的具有inline属性的标签（span、b、a、i等等）
3.box 是啥（盒模型）
box-sizing:content-box 和 box-sizing:border-box
4.宽度是有什么决定的
content+margin+padding+border
5.position 的 5 个取值
static fixed relative absolute sticky
image.png
image.png
6.z-index
层级 通过z-index来确定高低
