嵌套元素单独的CSS

Question

说我有以下 -

<div> 
    <span>First</span> 
    <span>Second</span> 
    <span>Third</span> 
</div> 

有没有用CSS来修改每个单独的样式，而无需在每种情况下适用一类独特的方法吗？

例如，像div span { color: blue; }之类的东西，但后来的跨度应用不同的颜色等等？

（...是的，我已经尝试了许多谷歌搜索第一！）

Answer 1

尝试nth-of-type或nth-child：

span:nth-of-type(1) { 
    color:blue; 
} 
span:nth-of-type(2) { 
    color:red; 
} 

span:nth-of-type(3) { 
    color:green; 
} 

here是代码示例