使用CSS为表中的某些元素指定样式

Question

  

可能重复：
  Apply style in a table to specific columns within the th and td

我有一张桌子，我需要能够为不同的列分配不同的样式，我需要： -

1. 表标题中的前两列（header1和header 2将被赋予text-align：left;然后表头中的所有剩余标题将被赋予text-align：center;

2. 与表行类似，表中所有行的前两行都是text-align：left;然后给出text-align：center;

的其余tds

所以基本上整个表中的前两列都将被保留，然后保持居中？

`

<tr>

<th>Header 1</th>
<th>Header 2</th>
<th>Header 3</th>
<th>Header 4</th>
<th>Header 5</th>
</tr>
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
<td>row 1, cell 3</td>
<td>row 1, cell 4</td>
<td>row 1, cell 5</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
<td>row 2, cell 3</td>
<td>row 2, cell 4</td>
<td>row 2, cell 5</td>

</tr>

Answer 1

假设您的表有一个类mytable：

.mytable td, .mytable th {
    text-align: center;
}
.mytable td:first-child, .mytable td:nth-child(2) {
    text-align: left;
}
.mytable th:first-child, .mytable th:nth-child(2) {
    text-align: left;
}

这可以更紧凑地写成：

.mytable td, .mytable th {
    text-align: center;
}
.mytable td:nth-child(-n+2) {
    text-align: left;
}
.mytable th:nth-child(-n+2) {
    text-align: left;
}