如何使一排黑色和第二列红色的第一列

问题描述 投票:8回答:5

我想给一个CSS类的行,我想提出的第一列的黑色和第二列红色。我不想使用COLGROUP因为这不是整个表应该实现一个排的具体行动。

css
5个回答
10
投票

你可以使用:

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

10
投票

这是可能的,而不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>

2
投票

...这不是整桌应该实现一个排的具体行动。

然后将不同的风格给定行可能是有用的你的第一和第二列:

<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>

2
投票

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

the Docs如何使用它。 此外,作为2019年初,有勉强的理由not to use CSS3 selectors


0
投票

您需要创建2种类型的CSS。 对于每一行,添加你想要的CSS。

© www.soinside.com 2019 - 2024. All rights reserved.