将桌子分成两半

2024-01-20

无论如何,是否可以使用 CSS 将表格分成两半并并排显示两个部分。

例如,采取这个:

| row1 | row1 | row1 |
| row2 | row2 | row2 |
| row3 | row3 | row3 |
| row4 | row4 | row4 |
| row5 | row5 | row5 |

并做这个:

| row1 | row1 | row1 |    | row4 | row4 | row4 |
| row2 | row2 | row2 |    | row5 | row5 | row5 |
| row3 | row3 | row3 |

我可以更改 HTML 标记(例如使用自定义类标记“中断”行),但我必须能够决定是否通过 CSS 拆分表格。

我知道我可以使用两个表并使用display:inline-table,但我必须只使用一张表,因为我需要一致的列宽(表必须具有自动布局)。


您可以使用多列,但它是 CSS3 属性。例如:

-moz-column-count: 2;
-moz-column-gap: 20px;
-webkit-column-count: 2;
-webkit-column-gap: 20px;
column-count: 2;
column-gap: 20px;

这应该适用于现代浏览器

你也可以尝试这个方法

http://www.csscripting.com/css-multi-column/ http://www.csscripting.com/css-multi-column/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

将桌子分成两半 的相关文章