仅选择带有css的表中的第一行

Question

我在HTML页面中有许多表,其中一些只使用tr & td其他表,他们可以使用:thead, tbody, tfoot, tr, th & td.

因为有些问题我们使用CSS规则来制作表格的左上边框,每个边框td都有自己的右边框和下边框.

因为这个特殊的东西,我们需要td在所有四个角落和他们的特定角落.

如何才能执行只能选择表中第一行的单个规则？

到目前为止,我正在使用此规则:

table.unit tr:first-child td:first-child, table.units thead tr:first-child th:first-child {
  border-top-left-radius: 10px;
}
table.unit tr:first-child td:last-child, table.units thead tr:first-child th:last-child {
  border-top-right-radius: 10px;
}

在这个jsfiddle你可以看到我的问题:(http://jsfiddle.net/NicosKaralis/DamGK/)

• 有没有办法同时解决这两个实现？
• 如果有,我该怎么办？
• 如果没有,你能帮我找出最佳方法吗？

PS:我可以更改表格的元素,但它会在第三方库中进行更多的重构,所以我们不想改变它.

Answer 1

您可以像这样处理广告情况：

tr td:first-child, tr th:first child {some styles}
thead + tbody tr td:first-child {revert the above styles}

但是，我不知道您如何处理 tfoot 的相同情况。您可能需要使用脚本。