不寻常的表，表行和表格单元嵌套

Question

我想将几个嵌套的div（如下所示）转换为一个CSS表结构，其中包含table，table-row和table-cell的显示样式。这很好用。但是DOM结构中还有一些其他元素（下面用类“红色”和“蓝色”标识）我无法删除，但我不需要它们用于屏幕上的外观。如果我将这些元素保留在DOM树中，则表结构无法正确显示。是否有可能让他们在DOM树中但忽略它们？

<div style="display: table">
  <div class="blue">
    <div style="display: table-row">
      <div class="red">
        <div style="display: table-cell">
          ...
        </div>
        <div style="display: table-cell">
          ...
        </div>
      </div>
    </div>
    <div style="display: table-row">
      <div class="red">
        <div style="display: table-cell">
          ...
        </div>
        <div style="display: table-cell">
          ...
        </div>
      </div>
    </div>
  </div>
</div>

Answer 1

你为什么要重新发明轮子？如果您想使用table，请不要假装您没有使用表格，而是通过divs自行实施。你没有得到任何东西，只是在浪费你的时间。

我能想象的唯一情况是你无法访问HTML - 否则为什么你不能删除这些div .red和.blue？

现在针对您的真实问题。您显然无法添加.red和.blue display: none或visibility: hidden，但您可以尝试display: inline;。祝你好运！