背景顶部菜单 css 颜色答案

【问题标题】：Background top-menu css color背景顶部菜单 css 颜色
【发布时间】：2014-11-28 15:27:40
【问题描述】：

CSS代码：

.sf-menu {
  position: relative;
  padding: 0;
  width: 100%;
  border-bottom: 3px solid #e9e9e9;
  background: #ffffff; 
}

@media (max-width: 767px) {
  .sf-menu {
    display: none;
  }
}

网站：

http://www.sapins-noel.fr/

尝试改变顶部菜单的背景颜色，默认值为#cbccbe；（灰色）我写了#ffffff（白色）但没有任何变化，有人知道吗？

【问题讨论】：

查看我们的代码，背景是不可见的，因为 .sf-menu 没有高度。

标签： css colors

【解决方案1】：

#header .sf-menu

优先，因为它是父级。如果你真的想绕过它 -

.sf-menu {  
    position: relative;
    padding: 0;
    width: 100%;
    border-bottom: 3px solid #e9e9e9;
    background: #ffffff !important;
}

【讨论】：

很高兴听到，记得使用 F12（大多数浏览器）作为开发工具，然后您自己就可以轻松发现这一点！ :)

【解决方案2】：

您需要使用更具体的选择器。

背景颜色是这样设置的：

#header .sf-menu {
    background: #cbccbe;
    border-bottom: 3px solid #c1c2b4;
}

您似乎正在尝试使用以下内容更改颜色：

.sf-menu {
    position: relative;
    background: #ffffff;
    padding: 0;
    width: 100%;
    border-bottom: 3px solid #e9e9e9;
}

第一个选择器比你的更具体，所以它会优先。

在您的选择器前面添加#header，特异性得分将相等。只要您的代码在默认值之后，它就会优先并覆盖它。