面试题：CSS :nth - child 伪类选择器的复杂应用

Question

假设有一个无序列表 <ul> 包含 10 个 <li> 元素，要求使用 :nth - child 伪类选择器实现以下样式：每隔 3 个 <li> 元素设置一种特殊背景颜色，并且第一个和最后一个 <li> 元素有不同于其他元素的字体颜色，写出具体的 CSS 代码。

Answer 1

ul li:nth-child(3n + 1) {
    background-color: /* 特殊背景颜色值 */;
}

ul li:first-child,
ul li:last-child {
    color: /* 不同于其他元素的字体颜色值 */;
}