Question

我正在使用Thematic处理WordPress主题。一切都很顺利，直到我开始玩子菜单。

您可以在此处查看正在开发中的网站：http://yem.synaxistech.net/

好的，这是我的CSS问题。如果你去上面的网站，并将鼠标悬停在“主页”按钮上，你会看到一个子菜单弹出。这正是我希望菜单看起来的样子。

但是，如果您在家中“点击”，然后转到该页面（http://yem.synaxistech.net/?page_id=17），再次将鼠标悬停在同一个按钮上，您将看到子菜单按钮后面有一个背景图片，我不能为我的生活摆脱！

这是一张图片：

http://i.stack.imgur.com/SQhwS.jpg

在左侧，您可以看到“正确”格式，但在右侧，背景在特定页面上显示。它以某种方式被主菜单继承，我似乎无法超越它。

有人可以帮帮我吗？我花了三个小时的时间试图解决这个问题但没有用。

提前致谢！

Answer 1

找到这些风格：

.sf-menu li.current-menu-item a,
.sf-menu li.current_page_item a {
    background-image: url(images/navbutton-hover.png);
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: left -2px;
}

有两种方法可以解决这个问题：

方式A： 你可以替换：

.sf-menu li.current-menu-item a,
.sf-menu li.current_page_item a

使用：

.sf-menu li.current-menu-item > a,
.sf-menu li.current_page_item > a

或方式B： 您可以添加以下样式：

.sf-menu li.current-menu-item ul a,
.sf-menu li.current-menu-item ul a {
        background-image: none;
}

菜单结构如下：

ul（主菜单）
- li（主要项目）
  - a（主要项目链接）
  - ul（子菜单）
    - li（子项目）
      - a（子项目链接）

因此原始选择器.sf-menu li.current-menu-item a可以选择所有子项链接并导致您遇到的问题。

Answer 2

转到下面的CSS文件： http://yem.synaxistech.net/wp-content/themes/youreventmatters/style.css

第144行，

你看到条目

.sf-menu li.current-menu-item a, .sf-menu li.current_page_item a
{
background-image: url(images/navbutton-hover.png);
background-color: transparent;
background-repeat: no-repeat;
background-position: left -2px;
}

然后从这里删除整个背景属性;）（为了安全起见，只删除background-image属性）

CSS菜单问题我无法搞清楚

2 个答案: