table 类布局的最佳 HTML/CSS 模型
Best HTML/CSS model for table-like layout
我想在我的项目中创建以下布局。
我的主要矩形元素可以有 3 个垂直列。中间列分为 3 行。顶行分为 2 列，底行分为 4 列，依此类推...
你可以把它想象成一个 table 具有非常不规则的行/列/子行/子列...在最低级别有 "cells"，每个单元格的大小取决于它的内容，每个单元格都会有一些内容。我希望单元格之间的 space 相等（例如 1em）
我目前的想法是将DIV与display=block和display=inline-block结合起来做一个树形结构。但是如果我设置 margin=1em;单元格的边距将添加到父级的边距并且看起来很难看。有没有更好的解决办法？我听说我应该避免使用 tables、colspan 等
如果你使用这样的结构，你可以添加一个 class 你的叶子 div（单元格）这样你就可以应用一个 css 语句来区分边距和其他 div结构。
类似于：
.cell-div {
margin: 0 0.5em;
}
我想在我的项目中创建以下布局。
我的主要矩形元素可以有 3 个垂直列。中间列分为 3 行。顶行分为 2 列，底行分为 4 列，依此类推...
你可以把它想象成一个 table 具有非常不规则的行/列/子行/子列...在最低级别有 "cells"，每个单元格的大小取决于它的内容，每个单元格都会有一些内容。我希望单元格之间的 space 相等（例如 1em）
我目前的想法是将DIV与display=block和display=inline-block结合起来做一个树形结构。但是如果我设置 margin=1em;单元格的边距将添加到父级的边距并且看起来很难看。有没有更好的解决办法？我听说我应该避免使用 tables、colspan 等
如果你使用这样的结构，你可以添加一个 class 你的叶子 div（单元格）这样你就可以应用一个 css 语句来区分边距和其他 div结构。
类似于：
.cell-div {
margin: 0 0.5em;
}