Question

我想把一个css类放到一行我想让第一列为黑色，第二列为红色。我不想使用colgroup，因为这是一个行特定的操作，不应该影响整个表。

Answer 1

您可以使用：

td { color: black; }
td:nth-child(2) { color: red; }

Answer 2

如果没有CSS3，这是可能的！

<强>示例
http://jsfiddle.net/Q3yu5/1/

CSS

tr.special_row td {
    background-color: #000;
}

tr.special_row td + td {
    background-color: #f00;
}

tr.special_row td+td+td {
    background-color: #fff;
}

<强> HTML

<table>
<tr class="special_row">
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
</tr>
<tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
</tr>
</table>

Answer 3

在CSS3中，您可以使用:nth-child()伪类。

请参阅the Docs了解如何使用它此外，截至2019年初，几乎没有理由not to use CSS3 selectors。

Answer 4

...这是一个行特定的动作，不应该影响整个表格。

然后将不同的样式应用于给定行的第一列和第二列可能很有用：

<style type="text/css">
    td.first
    {
        background-color: black;
        color: white;
    }
    td.second
    {
        background-color: red;
        color: white;
    }
</style>
<table>
    <tr>
        <td class="first">1st row, 1st column</td>
        <td class="second">1st row, 2nd column</td>
    </tr>
    <tr>
        <td>2nd row, 1st column</td>
        <td>2nd row, 2nd column</td>
    </tr>
</table>

Answer 5

您需要创建两种类型的CSS 对于每一行，您可以添加所需的CSS。

如何使第一列的第一列为黑色，第二列为红色

5 个答案: