CSS display

Formal syntax: none | inline | block | list-item | inline-block | inline-table | table | table-cell | table-column | table-column-group | table-footer-group | table-header-group | table-row | table-row-group | flex | inline-flex | grid | inline-grid | run-in | ruby | ruby-base | ruby-text | ruby-base-container | ruby-text-container | contents | flow-root

block后面放
不合法

flex 包括 flex-grow(伸) flex-shrink(缩) flex-basis

html 和 body 元素都是block的,但是他们的background会显示在整个页面上。

contents:
可以删除元素的盒模型规则。如果你希望一个元素要语义化而不是视觉目的,并且希望它能够参与网格或Flex布局的子元素,那么这一点非常有用。

如果 display:run-in 的 box 后面跟着一个 display block 水平的 box,那么这个应用了display:run-in 的 box 将会变成 display:inline 属性,同时内容嵌入到后面的 display 为 block 的box 中;否则这个 display:run-in 的 box 维持其本身的 block 属性。 // 当前元素跑-进(run-in)后面的元素。