css - 在 Ember 应用程序中定位 nth-child 时遇到问题

Question

我正在开发一个 Ember 应用程序，由于 Ember 脚本标签，我不得不使用错误的数字来定位第 nth-child。在 Ember 应用程序中是否有一种可靠的方法来使用 CSS 定位第 n 个 child ？

所以，而不是:

.league li:nth-child(1) h3::after { color: #eec600; }
.league li:nth-child(2) h3::after { color: #b0b0b0; }
.league li:nth-child(3) h3::after { color: #ae7435; }

我必须做的:

.league li:nth-child(3) h3::after { color: #eec600; }
.league li:nth-child(6) h3::after { color: #b0b0b0; }
.league li:nth-child(9) h3::after { color: #ae7435; }

Answer 1

您可以尝试使用 :nth-of-type()过滤掉脚本标签。

如果需要使用nth-child()那么你应该使用 Ember.js 1.8.0-beta

Ember.js 1.8.0-beta 不再将脚本标签插入 dom，因此使用 nth-child() 应该没有问题.

如果您使用 ember-cli你可以运行 bower install ember#1.8.0-beta.3 --save在您的元素中使用测试版