首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >CSS:显示属性差异

CSS:显示属性差异
EN

Stack Overflow用户
提问于 2008-09-19 20:08:28
回答 9查看 9.2K关注 0票数 5

display:block和display:inline的区别是什么?

EN

回答 9

Stack Overflow用户

回答已采纳

发布于 2008-09-19 20:10:09

块元素通常垂直堆叠,而内联元素将水平排列。

两个Div将堆叠在彼此的顶部,但如果您将它们设置为display:inline,它们将水平地相邻。反之亦然,使用跨度标签。

票数 6
EN

Stack Overflow用户

发布于 2008-09-19 20:11:10

是,

display:block使元素的行为类似于block,例如:<p>

显示:内联生成和元素布局内联。

这些可以应用于默认为相反显示类型的图元。

可能的值

代码语言:javascript
复制
* none - no display at all.
* inline - An inline box.
* block - A block box.
* inline-block - effectively a block box inside an inline box. Not supported by Mozilla at time of writing. IE will only apply inline-block to elements that are traditionally inline such as span or a but not p or div. Loopy.
* run-in - Either an inline or block box depending on the context. If a block box follows the run-in box, the run-in box becomes the first inline box of that block box, otherwise it becomes a block box itself. Crazy. Not supported by IE/Win or Mozilla at the time of writing.
* list-item - the equivalent of the default styling of the HTML li element.
* table - a block-level table - the equivalent of the default styling of the HTML table element. Not supported by IE.
* inline-table - an inline-level table. Not supported by IE.
* table-row-group - the equivalent of the default styling of the HTML tbody element. Not supported by IE.
* table-header-group - the equivalent of the default styling of the HTML thead element. Not supported by IE.
* table-footer-group - the equivalent of the default styling of the HTML tfoot element. Not supported by IE.
* table-row - the equivalent of the default styling of the HTML tr element. Not supported by IE.
* table-column-group - the equivalent of the default styling of the HTML colgroup element. Not supported by IE.
* table-column - the equivalent of the default styling of the HTML col element. Not supported by IE.
* table-cell - the equivalent of the default styling of the HTML td or th elements. Not supported by IE.
* table-caption - the equivalent of the default styling of the HTML caption element. Not supported by IE.

*source

票数 4
EN

Stack Overflow用户

发布于 2008-09-19 20:10:56

显示:块意味着元素以块的形式显示,就像段落和页眉一样。一个块的上下都有一些空格,并且它旁边不允许有HTML元素,除非以其他方式排序(例如,通过向另一个元素添加一个float声明)。display: inline表示元素以内联方式显示在同一行的当前块内。只有当它在两个块之间时,元素才会形成一个“匿名块”,但它的宽度可能是最小的。

票数 3
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/105100

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档