Css 如何将行划分为<；td>；在响应表中

我有一张这样的桌子：

+----+----+----+----+----+----+
| A  | A  | B  | B  | C  | C  |
+----+----+----+----+----+----+

我需要在小屏幕上得到这个结果

+----+----+
| A  | A  |
+----+----+
| B  | B  |
+----+----+
| C  | C  |
+----+----+

可能吗

我只想使用css，不想使用jquery。 使用display:property，td:：after 我该怎么办？ 我怎样才能解决这个问题

@介质（最大宽度：640px）{
#测试，测试thead，测试tbody{}，测试tr{
/* ? */
}
#测试th{
/* ? */
}
#测试td{
/* ? */
}
#测试td：：之后{
/* ? */
}
#测试tr{
边框底部：1px实心#ddd；
}
#测试th，
#测试td{
边界顶部：无；
边框底部：无；
}
}

A.
A.
B
B
C
C
D
D
E
E
F
F
和
@media
不是最好的朋友。

可以同时显示：块和
显示：表格如果我们想，那么让我们摇滚吧



*{框大小：边框框；-webkit框大小：边框框；}html，正文{高度：100%；边距：0；}
.桌子{
显示：表格；
宽度：100%；
表布局：固定；
左边框：1px实心#444；
边框顶部：1px实心#444；
}
.tr{
显示：表格行；
}
运输署署长，
.th{
显示：表格单元格；
背景：#eee；
边框底部：1px实心#444；
右边框：1px实心#444；
}
.th{
字体大小：粗体；
}
@介质（最大宽度：640像素）{
桌子
.tr{
显示：块；
}
.th，
.td{
宽度：50%；
浮动：左；
}
}

A.
A.
B
B
C
C
D
D
E
E
F
F
这是使用引导：



A.
A.
B
B
C
C
感谢您的评论。我制作的网页上满是表格标签。所以很难将table更改为div，但我从您的评论中得到了提示。td宽度50%是线索。再次感谢你！！没有线索。Width 50perc不会做您认为会做的事情。否则我不会建议这么大的翻拍。谢谢你的评论。评论是另一种解决方法。评论是我想不出办法。再次感谢您的评论。