Question

我正在使用Cobalt 8 CMS，之前的文章布局非常简单地由表格设计。

我在下面添加了一个例子。转换所有表格（以及学习如何）的想法令人生畏，但我想做的是最好的。表格字段显示提交表单的结果。有多行和多列的混合，以及两者的跨度。

我现在也在使用Joomla 3，所以也许div是更好的选择。

我很感激你的意见，

示例：

<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

简短版本：表格应该仅用于显示数据，如果您将其用于布局目的，屏幕阅读器可能会在页面中导航时遇到问题。

长版：

table元素以表格的形式表示具有多个维度的数据。表不应用作布局辅助工具。从历史上看，很多网络作者可以使用HTML格式的表格来控制页面布局难以从这些文档中提取表格数据。在特别是，可访问性工具的用户，如屏幕阅读器，是可能会发现使用表格导航页面非常困难用于布局。如果要使用表格进行布局，则必须使用该表格进行标记用户代理正确的属性role =“presentation” 代表辅助技术并正确传达的表格作者的意图是希望提取表格数据的工具来自该文件。

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

Answer 3

使用跨度的行数和列数，使其成为使用Table的有效选择。我总是遇到div的问题。

Answer 4

这样你做得很老套。我认为你应该使用div。如果您要展示几本书，那么这对于表格布局会很有用。

另外，我认为您应该尝试在所有属性值周围加上引号。这是一个基本的良好实践。

我应该将布局模板从表转换为div

4 个答案: