不尋常的表格，表格和表格單元的嵌套

我想將幾個嵌套的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

不尋常的表格，表格和表格單元的嵌套

回答

相關問題