css 样式表 - display
在网页布局中我们经常使用display来控制段落和div(Division:分割),基本上所有浏览器都支持。
display CSS1: (compact和market在css2.1移除)
1. 默认值 inline: 此元素会显示成内联元素,元素前后没有换行符。
2. none: 此元素不显示。
3. block: 此元素会显示成块级元素,前后带有换行符。
4. list-item:元素会作为列表显示。
5. run-in: 元素会根据上下文显示为块级元素或内联元素。
6. table: 元素会作为块级表格来显示(类似table), 表格前后带有换行符。
7. inline-table: 元素作为内联表格来显示(类似table), 表格前后没有带换行符。
8. table-row-group: 元素作为一个或多个行分组来显示(类似tbody)。
9. table-header-group: 元素会作为一个或多个行的分组类显示(类似thead)。
10. table-footer-group: 元素会作为一个或多个行的分组来显示(类似tfoot)。
11. table-row: 元素作为一个表格行显示(类似tr).
12. table-column-group: 元素作为一个或多个列的分组来显示(类似colgroup)。
13. table-column: 元素作为一个单元格显示(类似col)。
14. table-cell: 元素作为一个表格单元显示(类似td和th)。
15. table-caption: 元素作为表格标题显示(类似caption)。
16. inherit: 元素从父元素继承display的值。
CSS2.1
17. inline-block: 行内块元素。
CSS 3
18: flex: 显示一个元素作为块级可伸缩容器。
19: inline-flex: 显示一个元素为内联级可伸缩容器。
IE 扩展:
-ms-flexbox
-ms-grid
-ms-inline-flexbox
-ms-inline-grid
ruby
ruby-base
ruby-base-container
ruby-text
...
chrom扩展:
-webkit-box:
-webkit-inline-box:
grid:
initial:
inline-grid:
...