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

Question

我有一个大表格，需要将单元格的背景更改为1到6个色带，就像矩形堆叠在一起一样（其他信息将显示在单元格内）。虽然此示例是一个表，但我猜这适用于任何 DIV。我希望能够（通过javascript即时）抓住DOM中的“细胞容器”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“单元格容器”），并使背景具有三种不同的颜色，如浅蓝色，黄色和绿色。我尝试过添加高度为33%的儿童 div，并将 cellcontainer 的样式设置为相对，将儿童 div 设置为绝对等，但我还没有找到神奇的组合。

Answer 1

当你说你想使单元格的背景有3种不同的颜色时，你的意思是渐变吗？如果是这样，请尝试此操作

否则我不太明白你说的“让背景有三种不同的颜色”是什么意思。