html - 第一个中的 CSS 样式

Question

我正在尝试将我的 <tr> 的所有 <td> 元素设置为右对齐，除了我想要左对齐的第一个元素。我试过这个：

<style>
td { text-align: right };
td:first-child { text-align: left };
</style>

这使得所有单元格都右对齐。如果我交换这两行的顺序，那么所有单元格都是左对齐的。高度困惑。据 w3schools 称，

:first-child 选择器用于选择指定的选择器，仅当它是其父项的第一个子项时。

但这似乎并没有发生在我身上。

Answer 1

您的语法不正确。

td { text-align: right };                    /* This was being applied */
td:first-child { text-align: left };         /* This wasn't.. */

应该：

td { text-align: right; }
td:first-child { text-align: left; }

注意分号 - 它们不应该在括号之外{}

除此之外，您使用:first-child得当。

jsFiddle 演示

Answer 2

td:nth-child(2) { text-align: right; }

你可以在一行中做到这一点。

Answer 3

另一种选择，取决于你想要做什么：

table tr td {
    background-color:red;}
table tr td:nth-child(1) {
    background-color:green;}