如何使用单个连续渐变影响表格的一侧

Question

我想知道是否存在一种“简单”的方法来仅对表格的一侧进行渐变（即：仅最左侧的列），而无需单独进行每个渐变以给出连续的外观？

因此，在此代码中，日期应为彩色，颜色应从白色开始，在底部为纯色，所有文本应保持白色

请帮忙，否则我整晚头痛

<table>
    <tr>
        <td>1990</td>
        <td>words and things</td>
        <td>more words and things</td>
    </tr>
    <tr>
        <td>2000</td>
        <td>no color here</td>
        <td>nor color here</td>
    </tr>
    <tr>
        <td>2010</td>
        <td>this should be white</td>
        <td>and this too</td>
    </tr>
    <tr>
        <td>2020</td>
        <td>Oh the places you'll go</td>
        <td>the magic that is CSS</td>
    </tr>
    <tr>
        <td>2030</td>
        <td>I am but a lowly peon</td>
        <td>take pity upon my soul</td>
    </tr>
</table>

Answer 1

您可以在此处制作跨浏览器的渐变样式： http : //www.colorzilla.com/gradient-editor/

这里还有一些样式-用生成器为您创建的内容替换注释：

tbody tr td:first-child {
    /* this will apply to the first cell in each row */
}

tbody tr td:first-child + td {
    /* this will apply to the second cell in each row */
}