如何使每个单元格（<td>）表现得像 CSS 中的行？ [复制]答案

【问题标题】：How to make each cell (<td>) behave like rows in css? [duplicate]如何使每个单元格（<td>）表现得像 CSS 中的行？ [复制]
【发布时间】：2013-06-22 08:48:24
【问题描述】：

我正在为现有网站 (asp.net) 创建一个移动网站，并且布局是使用表格设计的。有什么方法可以将表格中的每个单元格转换为 CSS 中的一行，以便我可以将其放入移动屏幕，或者有更好的方法（除了更改我不允许的整个网站）。基本上，如何使用 CSS 将 2X4 表格变成 1x8 表格？

【问题讨论】：

"(aside from changing the whole website which I'm not allowed to)" ?为什么这就像那些不会从IE6升级的人
如果这是您的限制，我认为最好为小屏幕制作另一组表格。
@NickR - 我很乐意，但我不允许:(
我想我找到了答案..stackoverflow.com/questions/6773862/…谢谢大家！

标签： html css asp.net css-tables

【解决方案1】：

将此添加到您的移动视图 css

td{
    width:100%;
    display:block;
}

fiddle

【讨论】：

【解决方案2】：

您可以使用table-row 属性：

tr{
    display:table;
    width:100%;
}
td{
    display:table-row;
    background:#efefef;
}

Demo here.

【讨论】：