Css 第页中有两个单独的响应表

尝试在页面中创建分隔表：

手机上的第一张桌子看起来很好，但是，第二张桌子和第一张桌子使用相同的标签。如何让它继续下去

CSS:

---

如果您在

td

中添加了一个包含标题文本的属性，您可以完全消除将所有标题存储在CSS中的需要，并将代码简化为：

td:before {
    content: attr(title);
}

这将适用于任何数量的表，也意味着您可以轻松地将正确的标题从数据源直接输出到标记中；完全从CSS中删除它

例如：

表格{
宽度：100%；
边界塌陷：塌陷；
边缘底部：30px；
}
tr:n个类型（奇数）{
背景：#eee；
}
th{
背景:#fbfb；
颜色：黑色；
字体大小：粗体；
}
运输署，
th{
填充：6px；
边框：1px实心#ccc；
文本对齐：左对齐；
}
@仅介质屏幕和（最大宽度：760像素）{
桌子
thead，
t身体，
th，
运输署，
tr{
显示：块；
}
thead tr{
位置：绝对位置；
顶部：-9999px；
左：-9999px；
}
tr{
边框：1px实心#ccc；
}
运输署{
边界：无；
边框底部：1px实心#eee；
位置：相对位置；
左：50%；
}
td：之前{
位置：绝对位置；
顶部：6px；
左：6px；
宽度：45%；
右边填充：10px；
空白：nowrap；
}
td：之前{
内容：attr（title）；
}
}

标题1
标题2
1 TD
2 TD
3 TD
4 TD
5 TD
6TD
7 TD
8 TD
标题3
标题4
9 TD
10 TD
11 TD
12 TD
13 TD
14 TD
15 TD
16 TD

不确定这里有什么问题。你能为你想要得到的东西创建一个模型吗？这是屏幕截图-第一张表一切正常。然而，第二个显示了类型n开头的所有内容。需要从第一个表继续，。或者如何让它使用其他的词？完美的解决了！非常感谢。我希望我能，仍然需要更多的代表来做到这一点。当我有足够的时间时，我会立即标记：）

td:before {
    content: attr(title);
}