理解display：block，inline，inline-block

最新推荐文章于 2024-08-25 13:06:40 发布

晨潇冥

最新推荐文章于 2024-08-25 13:06:40 发布

阅读量145

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/qq_36971710/article/details/83000781

本文详细解析了HTML中span与div元素的区别。span作为内联元素，无法直接设置宽高，但能在同一行显示；div作为块级元素，可自由设定宽高，但默认独占一行。此外，还介绍了display: inline-block属性，它结合了两者优点，既可调整尺寸，又能保持在同一行显示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

举个典型的例子：
              span的默认为dispaly:inline,无法改变宽跟，但可以在一行显示。
             div为block，可以赋值宽跟高，但默认情况下会自动换到下一行显示。
             display：inline-block如上名字一样，既可以改变宽高又可以一行显示。