Parent li仅在特定页面中更改颜色

时间:2013-09-10 02:40:50

标签: css wordpress

我有一个使用自适应主题在wordpress中实现的网站,我的所有自定义样式和php文件都是以儿童为主题。

当您将鼠标悬停在“了解更多”导航栏中时,问题出现在主导航中,“了解更多”li正在破坏并更改颜色,并且还会松开其左边框线。奇怪的是它只发生在网站的2页上:

https://presslock.org/about/https://presslock.org/faq/

但在其他网页上它工作正常。

谢谢,非常感谢任何帮助

2 个答案:

答案 0 :(得分:1)

这些css行应用于悬停(加上其他一些,Firebug最适合检查这些变化)

.menu li:hover a {
    color: #F5E09A;
}
.menu .current_page_item a, .menu .current-menu-item a {
    background-color: #343434;
}
.menu li a {
    color: #660033;
}
.menu a {
    border-left: 1px solid #585858;
    cursor: pointer;
    display: block;
    font-size: 13px;
    font-weight: 700;
    height: 45px;
    line-height: 45px;
    margin: 0;
    padding: 0 0.6em;
    position: relative;
    text-decoration: none;
    text-shadow: 0 -1px 0 #000000;
    white-space: nowrap;
}
.current-menu-item a {
    background-color: #F6BC01;
    background-image: -moz-linear-gradient(center top , #F6BC01, #F5E09A, #F6BC01);
}

最后一项不适用背景色,但会将背景图片覆盖为黄色。

答案 1 :(得分:1)

快速修复:只需从style.css文件中删除类custom-menu-item的所有样式。删除这两部分:

.menu .current_page_item a,.menu .current-menu-item a{background-color:#343434;}

.current-menu-item a{background-color:#F6BC01;background-image:-moz-linear-gradient(top,#F6BC01,#F5E09A,#F6BC01);background-image:-webkit-linear-gradient(top,#F6BC01,#F5E09A,#F6BC01);background-image:-o-linear-gradient(top,#F6BC01,#F5E09A,#F6BC01);background-image:-ms-linear-gradient(top,#F6BC01,#F5E09A,#F6BC01);background-image:linear-gradient(top,#F6BC01,#F5E09A,#F6BC01);}

如果您对此问题的原因感兴趣,就像KnowHowSolutions所述,问题出在某些情况下的css属性中。当您将鼠标悬停在菜单项的子项上而当前页面是此菜单项时,将应用custom-menu-item的属性。如果您注意到,当您将鼠标悬停在“资源”的子项上时,也会在https://presslock.org/stats/页面上发生这种情况。

希望这有助于我的英语。