html - 像没有行跨度的 block 一样显示单元格

Question

http://jsbin.com/uzojax/2/edit

上面是我的 jsbin 我必须在没有 rowspan 属性的 block 中显示单元格 8，并且不会干扰该单元格的 html 表结构这怎么可能。

Answer 1

您可以将单元格显示为 block 或内嵌 block ，如下所示:

http://jsfiddle.net/dCgzh/1/

您可以使用 position: relative，但它会将单元格相对于它在表格中的位置定位，这使得设置其位置和宽度有点困难，因为单元格不“知道”的属性周围细胞。

如果您使用 position: absolute(就像在 fiddle 中)，则定位是相对于主体或本身具有定位的容器元素。使用该方法，您可以将单元格放置在表格的左侧。在 fiddle 中，表格有“position:relative”。允许您将单元格放置在表格的左侧，并赋予它与表格相同的宽度 (100%)。

  .csstdred {
    display: block;
    /*display: inline-block;*/
    position: relative;
    width: 200px;
  }

没有与 rowspan 等效的 CSS，这是有道理的。表格用于表格数据。因此，表是页结构的组成部分。因此，像 rowspan 这样的属性不能仅仅被视为样式，因此它们可以作为单独的 HTML 属性而不是 CSS 样式使用。