Html 使用不同颜色设置列表项的样式

我想用三种不同的颜色来设计我的列表项。推荐的方法是什么

到目前为止，我的代码是：

li{
宽度：33.333%；
浮动：左；
填充：15px；
列表样式：无；
}
.光{
背景色：#085dce；
}
.中等{
背景色：#0051bb；
}
.黑暗{
背景色：#004bad；
}

浅色
中色
深色
浅色
中色
深色
浅色
中色
深色
浅色

使用第n个子项来区分项目

li:nth-child(3n+1) {background-color: #085dce;}
li:nth-child(3n+2) {background-color: #0051bb;}
li:nth-child(3n) {background-color:#004bad;}

---

使用第n个子项来区分项目

li:nth-child(3n+1) {background-color: #085dce;}
li:nth-child(3n+2) {background-color: #0051bb;}
li:nth-child(3n) {background-color:#004bad;}