CSS中display属性:常见取值及其作用详解

3 min read

在计算机编程中,display通常用于指定HTML元素的布局方式。

display 属性有以下几种经常使用的取值:

  • block: 将元素作为块级元素显示,通常占据一整行,可设置宽高。
  • inline: 将元素作为内联元素显示,并且元素不强制换行,只占据其内容的宽度。
  • inline-block: 将元素呈现为内联元素,但可以设置宽度、高度和内外边距等属性。
  • none: 元素不显示,通常通过 JavaScript 来控制显/隐状态。
  • flex: 容器使元素呈现 flexible 布局模式,常用于响应式设计,垂直/水平居中等布局需求。
  • grid: 容器使所有子元素呈现网格布局模式,可通过CSS Grid排列子元素。

其他取值还有table,table-cell,table-caption,table-column等,也可针对具体应用作为参考选择合适的取值。