html - 两种颜色的表格单元格背景

Question

如何制作(仅使用 CSS，没有背景图像)html 表格单元格(TD 标签)，左半边背景为红色，右半边背景为绿色。我不想要两个单元格，只需要一个由 CSS 定义的具有双色背景的 td 单元格。

Answer 1

我使用了 CSS 渐变概念。这里第一种颜色从 0 开始到 50% 结束，而第二种颜色从 51% 开始到 100% 结束。因此，可以为每种颜色指定比率。

td {
  background: linear-gradient(to right, tomato 50%, lightgray 51%);
}

<table>
  <tr>
    <td>
      Two Color Background
    </td>
  </tr>
</table>