inline元素:
元素的高度基于文字高度,由行高决定(行高不能低过一定的数值),inline元素不接受width/height属性。
bolck/inline-bolck元素:
元素高度由文档流高度决定。
什么是文档流?
①,内联元素从左到右排列,块级元素从上到下排列
②,元素可脱离文档流,浮动,绝对/绑定定位可以使元素脱离文档流,如果一个块级元素内的子元素脱离文档流,则文档流高度就不包含该脱离的元素,块级元素的高度也会因此缩小。
字体大小:
字体大小受font-size影响,但并不由它决定,而且不同字体设置相同的font-size,其大小也是不一样的,因为font-size的值是决定一个字的设计模板大小,font-size的大小就比如印章的大小,字在印章里面,印章的印面体积肯定是比字大的。
不同的字体不仅模样不同,而且字体模板也不同,行高可能还不同,所以相同的font-size,字体大小也会不一样。
常见长度单位:
①,px
绝对单位,1px代表1像素,
②,em
元素内部的foot-size决定em的大小
③,rem
由根元素(html)的font-size决定
④,%
百分比,参考目标为父级元素
⑤,vh vw
跟%差不多,100vh代表页面视口高度,100vw代表页面视口宽度。参考目标为视口大小。