如何根据订单列出项目样式

Question

我有一个由li列表组成的菜单。每个li项目需要具有不同的背景颜色，根据其在列表中的位置：

第一项是粉红色，
第二个是橙色，
第三是绿色，
等等...

每个项目都有自己的ID，所以假设每个项目都有自己的CSS样式。 （例如，第一项的ID是menu-item-30，第二项的ID是menu-item-57，依此类推，其中随机数为ID。）

但是，该网站应该以不同的语言运行，并且在每种语言中，列表项具有不同的ID。 （例如，英语菜单中ID为menu-item-30的项目，法语菜单中有ID menu-item-241。）

我想知道实现这一目标的唯一方法是将ID添加到CSS规则中，如下所示：

#header #access li.menu-item-30,
#header #access li.menu-item-210, /*spanish*/
#header #access li.menu-item-241 /*french*/{
/*add header prefix to li's only'*/
   background: url('images/headers/navbar.png') 0 -124px repeat-x transparent;
   border-bottom: 3px solid #f26122;

}

或者，如果有一种方法 - 可以在IE7及更高版本中使用 - 使用更通用的规则，例如nth-child等。

Answer 1

有一种方法。您可以为元素添加rel="home"属性，然后使用css，您可以执行此操作：#header #access li a[rel="home"] { }

如果您无法访问代码，那么唯一的方法是为每个元素编写css。