更改Foundation中顶部条形图的颜色

Question

好吧，所以我对使用Foundation有点陌生，我已经尝试了一些关于各种支持的"修复"，但我仍然无法解决。用红色圈出的部分不会变成和其他部分一样的粉红色吗？

好吧，我有一张图片，但我没有发布它的声誉。基本上，我得到了适用于所有下拉菜单的代码，但不适用于左边没有任何东西的小矩形。

我在StackOverflow上从另一个人的问题中找到了一段代码，并对其进行了修改…

.top-bar {
    background: #FF859C !important;
}
.top-bar-section li a:not(.button) {
    background: #FF859C !important;   
}
.top-bar-section li a:not(.button):hover {
    background: #BCD955 !important;   
}
.top-bar-section ul li.active > a {
    background: #FF859C !important;   
}

但它不起作用？这是我真正对它做的唯一一次编辑，但就我的一生而言，我无法使它适用于那一个矩形。

耶！我可以发布图片！

[在此输入图像描述][1]

嗯。在找到代码位向大家展示的同时，我自己修复了它。所以，谢谢你让我更深入地了解它！！

我没有从Foundation的站点复制代码，而是在我的基础Foundation css文件中找到了它。

 @media only screen and (min-width: 40.063em) {
  .top-bar {
    background: #016B98;
    overflow: visible; }
    .top-bar:before, .top-bar:after {
      content: " ";
      display: table; }
    .top-bar:after {
      clear: both; }
    .top-bar .toggle-topbar {
      display: none; }
    .top-bar .title-area {
      float: left; }
    .top-bar .name h1 a {
      width: auto; }
    .top-bar input,
    .top-bar .button,
    .top-bar button {
      font-size: 0.875rem;
      position: relative;
      top: 7px; }
    .top-bar.expanded {
      background: #333333; }

因此，感谢您的帮助！

第一个背景是我需要的地方！对于那些发现这一点并感到困惑的人来说，这就是我在更改颜色时遇到的问题（插入图片，我仍然无法发布，因为你需要10张！）。

不管怎样，再次谢谢你。非常非常！

Answer 1

要更改Foundations菜单中下拉箭头的颜色，只需将此代码添加到app.css文件中即可。

.top-bar-section .has-dropdown>a:after {
border-top-color: #ff859C ;/*change to what ever color you would like*/
border-right-color: transparent;
border-bottom-color: transparent;
border-left-color: transparent;
}

注意：如果您在普通css文件中更改Foundations默认样式，则需要添加！重要的标签到你的风格结束。