如何使用CSS将div背景分割为'n'色带

Question

我有一张大桌子，需要将单元格的背景更改为1到6个色带，就像矩形堆叠在一起（并且其他信息将出现在单元格内）。虽然这个例子是一个表，但我猜这适用于任何DIV。我希望能够（通过javascript即时）抓住DOM中的'cellcontainer'DIV并创建子DIV以创建带状背景效果。

<table border=1 width=400 height=400>
    <tr>
        <td>
            <div class="cellcontainer">
                One
            </div>
        </td>
        <td>Two</td>
    </tr>
    <tr>
        <td>Three</td>
        <td>Four</td>
    </tr>
</table>

对于这个简单的表格，我正在尝试使用第一个单元格（使用div'cellcontainer'）并使背景有三种不同的颜色，如浅蓝色，黄色和绿色。我尝试添加高度= 33％的儿童div，并将cellcontainer的样式设置为relative，将div设置为绝对等等，但我还没有找到神奇的组合。

Answer 1

当你说你想让单元格的背景有3种不同的颜色时，你的意思是渐变吗？如果有，请尝试this

否则我不太清楚你的意思是“让背景变成不同的颜色”。