高度与文档流

一、div高度是由什么决定的?

div高度由其内部文档流元素的高度总和决定。

二、文档流是什么?

文档流:文档流元素的流动方向。

  • 内联元素:从左往右流动,如果宽度不够遇到阻碍,则换行继续流,(如果换行中一个元素中是很长的中文则会被分开,如果是英文单词,则不会被分开,如果想让英文被分开,则设置属性:word-break:break-all)

  • 块级元素:从上往下流动,每个块级元素另起一行。
    (如果想让多个块级元素在一起,可以增加浮动效果)
    div的宽度width最高为100px。

三、内联元素span的高度是由什么决定的?

内联元素的高度是不可测的,当字体比较小的时候,可以用line-hight来控制行高。

  • 如果span里面只有一个字,span的行高由什么决定?
    由字的建议行高总和其他与字体相关的使用来确定,这个值由设计师决定,前端无法确定。
  • 如果有多个span,那么div的行高由什么来决定?
    哪个span最高,则div的高度则由那个行高最高的span来决定。
    例如一个span的高度为140px,另一个span的高度为121px,那么div的高度则为140px。
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问题: div的高度是如何确定? span的高度是如何确定? 1.预备: 文档流:指文档内元素的流动方向; 内联元...
    索伯列夫阅读 217评论 0 0
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,796评论 1 92
  • 在CSS里,一个元素的高度是由其内部文档流元素高度总和决定的!那么文档流是什么呢?(加border可检测) 文档流...
    酒极子阅读 669评论 0 1
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 27,695评论 1 45
  • 一 外部式css样式 (也可称为外联式)就是把css代码写一个单独的外部文件中,这个css样式文件以“.css...
    KunMitnic阅读 962评论 0 1