css: line-height 与box-sizing

css

1、line-hight:

行高line-height，是文本行基线这件的距离，不是字体大小，它确定了各个元素框的高度增加或减少多少。

对于块级元素：定义了元素中文本基线之间的最小距离。

line-height并不影响替换元素的布局，但是确实可以应用到替换元素。

行间距：line-height - font-size

定义font属性的时候，用户代理会自动会生成一个line-height。

浏览器	FF
字体大小（font-size）	12px	13px	14px /15px	16px	18px	20px	22px
行高（line-height）	17px	19px	20px	21px	24px	27px	30px

 

浏览器	Chrome
字体大小（font-size）	12px	13px	14px /15px	16px	18px	20px	22px
行高（line-height）	17px	19px	20px	21px	24px	27px	30px

 

浏览器	IE9
字体大小（font-size）	12px	13px	14px	16px	18px	20px	22px
行高（line-height）	15.8px	17.2px	18.5px	21.2px	23.8px	26.4px	29px

 

浏览器	360
字体大小（font-size）	12px	13px	14px /15px	16px	18px	20px	22px
行高（line-height）	17px	19px	20px	21px	24px	27px	30px

在inline元素中，不是文字撑开了div的高度，而是line-height！

 

2、box-sizing

只是为了规定box modeling

 

box-sizing ： content-box || border-box || inherit

content-box 为默认值