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

我想将几个嵌套的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>

来源

2012-08-05 Oliver Mattern

为什么你想重新发明轮子？如果你想使用table只是做它，不要假装你没有使用表自己与divs自己实现它。你没有获得任何东西，只会浪费你的时间。

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

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

来源

2012-08-05 11:32:56 mkk

我认为你是对的，但实际上我没有访问HTML。 HTML是这样的，但我希望它能像表格一样布局。如果我能告诉任何HTML元素被忽略，它会有所帮助。将其设置为“display = none”或“visibility = hidden”会使包括所有孩子的整个元素消失。 “display = inline”也不能解决问题。也许这个问题是不可能解决的。 – 2012-08-05 12:42:26

嗯，我想到的唯一想法，这是非常丑陋的一个，是使用JavaScript并删除.red和.blue，并希望最好的。没有别的东西出现在我的脑海里 – mkk 2012-08-05 15:07:25

'你为什么要重新发明轮子？'因为有响应性的设计问题。 – Neolisk 2016-03-09 14:55:44

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

回答

相关问题