css - 将 css 添加到第一个 child 和下一个 child 样式？

Question

我喜欢这个标记

<div class="sprite player" style="top: 28%; left: 26%;"></div>
<div class="sprite player" style="top: 10%; left: 37%;"></div>
<div class="sprite player" style="left: 36%; top: 28%;"></div>

每个元素都有内联样式，但我想把它放在 CSS 中，我不想像新类一样放置然后添加样式，这也许可以通过伪类第一个子类然后第二个等等来完成。

当我得到新的 css 时，我需要这样的东西

.player:first-child{
top: 28%; left: 26%;
}
.player:first-child + .player{
top: 10%; left: 37%;
}

等等，有没有可能做成那样？

Answer 1

试试这个可能对你有帮助

.player:nth-child(1){
top: 28%; left: 26%;
}
.player:nth-child(2){
top: 10%; left: 37%;
}
.player:nth-child(3){
left: 36%; top: 28%;
}