css - 你如何按组/顺序 CSS 定位 li 项目

Question

我希望前 3 个项目为红色，接下来的 2 个项目为绿色，其余项目为黄色。

如何用 CSS 做到这一点？

<ul>
    <li>1 (red)</li>
    <li>2 (red)</li>
    <li>3 (red)</li>
    <li>4 (green)</li>
    <li>5 (green)</li>
    <li>6 (yellow)</li>
    <li>7 (yellow)</li>
    <li>8 (yellow)</li>
</ul>

标签： css