div的高度问题
1. div里面没有内容的时候,高度是多少?
- 是0
2. 若div里面有文字,且css设置font-size:20px
,浏览器显示div的高度是28,为什么?
- 第一种错误回答:行高的默认值就是1.4(28/20=1.4)
3. 若换了字体,div的高度又变了,为什么?
- 默认的行高是由字体设计师自己设计的。所以不同的字体有着不同的行高
4. 一个中文对应几个空格,是由字体设计师所设计的。
总结:
- div的高度=字体*它建议的行高
- 如果div里面只有内敛元素,则div的高度就是这一行的行高。如果有多行内敛元素,则就是行高的叠加,若有一个单词特别长,则要看是否加了
word-break: break-all;
,再判断高度。 - div的高度就是由它内部文档流高度总和确定,若有脱离文档流的则不计算它的高度。
2018-05-19