为什么菜单项颜色没有改变，但背景是？答案

【问题标题】：Why is menu item colour not changing but background is?为什么菜单项颜色没有改变，但背景是？
【发布时间】：2019-10-31 19:37:31
【问题描述】：

谁能告诉我为什么“回转环”的颜色不是红色，而背景颜色确实是黄色？我确定我正在做一些非常愚蠢的事情......但它可能是什么超出了我的范围。 Screenshot showing elementor editor with menu bar

/* Decorate Slewing Rings in Menu */ .slewing-rings { 
    background-color: 
    yellow; color: red; 
    }

一如既往，谢谢你。米歇尔

【问题讨论】：

标签： css wordpress elementor

【解决方案1】：

也许你的文本颜色是从父元素继承而来的。

试试看

color: red !important;

【讨论】：

【解决方案2】：

您可以通过两种方式做到这一点： 1.你可以像这样给css属性赋予!important

/* Decorate Slewing Rings in Menu */ 
   .slewing-rings { 
     background-color: yellow; 
     color: red !important; 
    }

您可以为父类指定“.slewing-rings”类来更改其优先级。

/* Decorate Slewing Rings in Menu */ 
   .parentClass .slewing-rings { 
     background-color: yellow; 
     color: red !important; 
    }

【讨论】：

【解决方案3】：

您需要设置包含“Slewing Rings”文本的子元素的样式，而不是周围的标签框（这是您的 .slewing-rings 类当前正在应用的内容。）我不知道您的确切节点 -该图片中的树，但如果您右键单击并检查该按钮上的元素，请尝试设置包含文本的元素的样式。

<div class="slewing-rings">
  <span>Your Text Is Probably Here</span>
</div>

现在您已经提供了页面链接，我可以提供更简洁的帮助：

<li class="slewing-rings menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-171">
  <a href="https://michellepace.com/02/slewing-rings/" class="elementor-item has-submenu" id="sm-15723547752042446-1" aria-haspopup="true" aria-controls="sm-15723547752042446-2" aria-expanded="false">Slewing Rings<span class="sub-arrow"><i class="fa"></i></span></a>
</li>

“a”标签需要在您的 CSS 中定位。但是，您的网站似乎按照您的预期运行，因此您可能已经弄清楚了。似乎 elementor-item 类正在努力提供红色。

【讨论】：

嗨，Blrzzzt，这是我真正感到困惑的地方。查找并选择我要更改的正确元素/事物（通过 Chrome 检查器）。我的 CSS 至少可以说是令人沮丧的。您能否告诉我我将使用哪些子元素选择 - 这是页面michellepace.com/02。我尝试使用“elementor-nav-menu--main”......但是将整个菜单选择为黄色，并且仍然没有读取文本。对不起，我迷路了...... :(

【解决方案4】：

该类已添加到 li 项中，这就是您的 css 不起作用的原因。

试试这个

.slewing-rings a {
   color: red;
}

【讨论】：