萬惡的bug之源
- height：100px 固定高度
- width: 100% 寬度百分之百
1高度是由什么決定的
- 內(nèi)聯(lián)元素
- 塊級(jí)元素
div高度由其內(nèi)部文檔流元素的高度總和決定
什么是文檔流：文檔內(nèi)元素流動(dòng)方向
內(nèi)聯(lián)元素從左往右流動(dòng)幻件，流動(dòng)遇到阻礙就換行流動(dòng)
如果是塊級(jí)元素匆浙，每個(gè)塊級(jí)元素獨(dú)占一行，從上往下流
span 高度
baseline
line-hight
給span里面的字體設(shè)置font-size為100px，這里的fontsize是指字母最高的高度到最低的高度之間有100px, 但是span的高度并不是100px,span的高度將會(huì)是瀏覽器提供的推薦行高line-height,比如說涧衙，此時(shí)line-height為fontsize的1.4倍嗅定，那么span行高就為140px碍彭，所以說癣疟，line-height是根據(jù)fontsize決定的。
多個(gè)span元素排列在一起的時(shí)候惕虑，是按照基線baseline排列的
脫離文檔流
1.position：fixed
（有bug會(huì)導(dǎo)致原本占一行塊級(jí)元素收縮）
2.position：absolute
2.line-box 是啥
inline box是我們平時(shí)所說的具有inline屬性的標(biāo)簽（span坟冲、b磨镶、a、i等等）
3.box 是啥（盒模型）
box-sizing:content-box 和 box-sizing:border-box
4.寬度是有什么決定的
content+margin+padding+border
5.position 的 5 個(gè)取值
static fixed relative absolute sticky
6.z-index
層級(jí) 通過z-index來確定高低
