在下拉导航中将文本颜色设置为活动状态

时间:2013-10-03 20:50:06

标签: html css

我创建了一个导航栏,您可以将鼠标悬停在某个元素上,然后执行一个下拉列表,其中包含更多可供选择的选项。

我遇到的问题是当我选择一个元素然后将鼠标悬停在子菜单上时,主要元素颜色将不会保持活动状态。我尝试添加一个活动类,但似乎没有工作。

a:active {
    color: #F1F1F1;
}

这是jsFiddle这将更好地解释我遇到的问题。如果有人不介意为我检查。那会很棒。

谢谢!

1 个答案:

答案 0 :(得分:3)

所以问题是当您将鼠标悬停在链接本身(a元素)上时,会设置链接的颜色。当你将鼠标悬停在包含链接及其子菜单的元素上时,你需要做的是使链接的颜色发生变化,这样当你将鼠标悬停在子菜单上时,你仍然将鼠标悬停在包含元素上({{ 1}}元素)

此处使用子选择器li,以便当您将鼠标悬停在父链接上时,子菜单链接也不会受到影响。请注意,IE6不了解>选择器;因此,如果您希望它们能够在远期工作,您将必须提供子>元素类。

CSS:

a

JSFiddle here.