css - 如何使用 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”)并将背景设为三种不同的颜色，例如浅蓝色、黄色和绿色。我试过添加 height=33% 的子 div，将 cellcontainer 的样式设置为 relative，将子 div 设置为 absolute，等等，但我还没有找到神奇的组合。

Answer 1

当您说要将单元格的背景设为 3 种不同的颜色时，您是指渐变吗？如果是这样，请尝试 this

否则我不太确定“将背景设为 3 种不同的颜色”是什么意思。