Chrome突然覆盖样式表答案

【问题标题】：Chrome overriding stylesheet suddenlyChrome突然覆盖样式表
【发布时间】：2014-04-30 15:44:09
【问题描述】：

不知道我昨晚做了什么，但现在我今天早上起床，chrome 似乎覆盖了我的锚和输入样式。我希望我可以在这里发布一段 sn-p 代码，但我不知道可能是什么代码导致了它。我不想把!mportant 到处都是来修复它，所以我希望有人可以看看test site 并找出铬不喜欢什么。页面顶部（电子邮件、电话和搜索）的 headerWidgets 不应该有装饰，并且应该在悬停时改变颜色。我什至不能再将光标放在搜索输入中。导航菜单不应该有装饰，但悬停有效。去搞清楚。 chrome 开发工具向我展示了这一点：

a:-webkit-any-link {        user agent stylesheet
    color: -webkit-link;
    text-decoration: underline;
    cursor: auto;
}

还有一堆用于输入的用户样式表条目

【问题讨论】：

标签： css google-chrome overriding stylesheet

【解决方案1】：

a:-webkit-any-link {
    color: -webkit-link;
    text-decoration: underline;
    cursor: auto;
}

是a标签的默认webkit样式。

添加一个css选择器#email a,#phone a并把你想要的样式放在里面。像这样：

#email a,#phone a{
    text-decoration:none;
}

对于悬停：

#email a:hover,#phone a:hover{
    color:red;
}

一个更好的选择器来定位#headerWidgets中的所有锚标签

#headerWidgets a {
    color: #F00;
}

#headerWidgets a:hvoer {
    color: #CCC;
}

你不能再点击搜索框的原因是div#headerMenuWrapper挡住了去路。在开发工具上，将鼠标悬停在此元素 <div id="headerMenuWrapper" class="clearfix"> 上，您将看到它覆盖了 #headerWidgets

【讨论】：

非常感谢。我确实已经为电子邮件和电话设置了样式，但是昨晚我为徽标和菜单添加了该包装器，并且并没有真正想到包装器可以覆盖小部件，即使包装器内的任何元素都没有覆盖小部件。现在我已经为包装器使用了正确的尺寸和定位，并且它现在可以工作了。我对导航菜单本身有一个更具挑战性的问题，也许你可以帮助我：stackoverflow question