在wordpress中将背景图像添加到导航菜单中，并动态更改图像

Question

在我的wordpress主页上有导航菜单，所以我想在前4个导航菜单中添加4个不同的图像，如果第5个菜单可用，那么对于第6个-> 2图像、第7 ->第3图像、第8->第4个图像，这样的序列会一直运行到菜单列表的末尾。因此，它继续4组系列。因此，对于导航图像，我使用unorderd列表这个标记。所以请帮帮我..。我受够了那个问题。

Answer 1

在这种HTML标记的情况下

<ul id="menu">
    <li>item 1</li>
    <li>item 2</li>
    <li>item 3</li>
    <li>item 4</li>
    <li>item 5</li>
    <li>item 6</li>
    <li>item 7</li>
    <li>item 8</li>
    <li>item 9</li>
</ul>

您可以使用:nth-child()选择器。

下面是CSS：

#menu {
    list-style-type: none;
}

#menu li:nth-child(4n-3) {
    background: red;
}
#menu li:nth-child(4n-2) {
    background: green;
}
#menu li:nth-child(4n-1) {
    background: blue;
}
#menu li:nth-child(4n) {
    background: silver;
}

只需将background属性中的颜色替换为要用作背景的图像。

http://cssdeck.com/labs/csfcyj5t