我應該如何將我的佈局模板從表格轉換爲div

Question

我使用的是Cobalt 8 CMS，而且以前的文章佈局非常簡單地由表格設計。

我在下面添加了一個例子。轉換所有表格（以及學習如何）的想法令人望而生畏，但我想做的是最好的。表格字段顯示提交表格的結果。有多個行和多個列的混合，並且有一些跨越兩者。

我現在也在使用Joomla 3，所以也許divs是更好的選擇。

我會感謝你的建議，

例子：

<table id='display' width=648 border=0 summary=""> 
    <tr> 
     <td rowspan=7 width=228><?php echo $item->fields_by_id[3]->result; ?></td> 
     <td width=200><b>Author:</b></td> 
     <td width=220><?php echo $item->fields_by_id[1]->result; ?></td> 
    </tr> 
    <tr> 
     <td width=200><b>Publisher:</b></td> 
     <td width=220><?php echo $item->fields_by_id[2]->result; ?></td> 
    </tr> 
    <tr> 
     <td width=200><b>Genre:</b></td> 
     <td width=220><?php echo $item->fields_by_id[9]->result; ?></td> 
    </tr> 
    <tr> 
     <td width=200><b>CRR Heat Rating:</b></td> 
     <td width=220 width=420><?php echo $item->fields_by_id[11]->result; ?></td> 
    </tr> 
    <tr> 
     <td colspan=2 width=420><?php echo $item->fields_by_id[12]->result; ?> 
</td> 
    </tr> 
    <tr> 
     <td colspan=2 width=420><?php echo $item->fields_by_id[10]->result; ?> 
</td> 
    </tr> 
    <tr> 
     <td colspan=2 width=420><?php echo $item->fields_by_id[13]->result; ?> 
</td> 
    </tr> 
    <tr> 
     <td colspan=3 width=648><?php echo $item->fields_by_id[4]->result; ?></td> 
    </tr> 
    <tr> 
     <td colspan=3 width=648><?php echo $item->fields_by_id[5]->result; ?></td> 
    </tr> 
</table> 

Answer 1

表是對錶格數據 - 不呈現。

因此，您示例中的數據不是表格。因此，使用CSS

Answer 2

使用跨度的行和列的數量，使其成爲使用表格的有效選擇。我一直面臨div的問題。

Answer 3

這樣你做這件事是非常老套的。我認爲你應該使用div。如果你正在展示幾本書，那麼這對桌子佈局來說很好。

此外，我認爲你應該嘗試引用所有的屬性值。這是一個基本的良好做法。

Answer 4

簡版：表格只能用於顯示數據，如果您將其用於佈局目的，屏幕閱讀器可能會在瀏覽頁面時遇到問題。

龍版本：

表元素表示的數據與一個以上的尺寸，在一個表中的形式。 表不應該用作佈局幫助。歷史上，許多作者都使用HTML中的表格作爲控制其頁面佈局的一種方式，使得難以從這些文檔中提取表格數據。特別是， 可訪問性工具的用戶（如屏幕閱讀器）爲 ，可能會發現導航頁面使用 進行佈局很困難。如果要使用表格進行佈局，則必須標記 屬性role =「presentation」，以便用戶代理正確地將 表示爲輔助技術的表格，並將作者的意圖正確傳達給希望使用的工具的 從文檔中提取表格數據 。

http://www.w3.org/html/wg/drafts/html/master/tabular-data.html#the-table-element