我有一个网站:
http://cancersurvivorshipireland.com/cancersurvivorshipireland.com/wordpress/ (临时地址)
但我在标题中的所有菜单主题都是相同的颜色,它们都是绿色的。我试图让他们得到所有不同的颜色。
例如。 Home =绿色,新闻=红色,博客=黄色。但完全不知道怎么做?
答案 0 :(得分:1)
您可以使用CSS nth child selector执行此操作,如下所示:
#menu-default li:nth-child(1) a {
color: green;
}
#menu-default li:nth-child(2) a {
color: red;
}
#menu-default li:nth-child(3) a {
color: yellow;
}
#menu-default li:nth-child(4) a {
color: orange;
}
#menu-default li:nth-child(5) a {
color: blue;
}
答案 1 :(得分:1)
每个菜单项都有一个不同的id和一个匹配的类,即,li.menu-item-39
也是li#menu-item-39
。您可以使用CSS来定位这些ID或类,无论您更熟悉哪个。
li.menu-item-39 > a { /* Home */
color: green;
}
li.menu-item-43 > a { /* News */
color: red;
}
li.menu-item-47 > a { /* Blog */
color: yellow;
}
已编辑以解决其他问题:您可以使用:nth-child
伪类来执行此操作,但这仅适用于支持CSS3的浏览器。
答案 2 :(得分:0)
您可以在list元素上使用:nth-child。将其添加到您的css文件
#menu-default > li:nth-child(1) > a { color: green; }
#menu-default > li:nth-child(2) > a { color: red; }
#menu-default > li:nth-child(3) > a { color: yellow; }
#menu-default > li:nth-child(4) > a { color: white; }
#menu-default > li:nth-child(5) > a { color: orange; }
答案 3 :(得分:-2)
您需要进入我假设的navigation.php文件,并为每个文件添加css id参数,然后在styles.css中为它们指定颜色。
如果您不熟悉编辑文件或更改代码,那么这不是一个简单的解决方法。
这是一些css代码:
#menu-default > li:nth-child(1) > a { color: green; }
#menu-default > li:nth-child(2) > a { color: red; }
#menu-default > li:nth-child(3) > a { color: yellow; }
#menu-default > li:nth-child(4) > a { color: white; }
#menu-default > li:nth-child(5) > a { color: orange; }