如何使移动wordpress网站上的菜单按钮可见？

我使用了一个名为Vacation的BoldGrid主题，它有一些我编辑过的CSS，但由于某种原因，我无法更改移动设备上的菜单按钮（您单击完整菜单的三行）为红色（＃960000）和白色（#fff）。任何想法我做错了什么？我应该在哪里输入颜色代码？现在这三条线在点击前是不可见的。如何使移动wordpress网站上的菜单按钮可见？

/*----------------------------------------------- 
## Main Menu 
-----------------------------------------------*/ 
/* Typography */ 
.navbar-default .navbar-nav { 
    float: none; 
    margin: 0 auto 10px; 
} 

/* Nav Center */ 
.navbar .navbar-nav { 
    display: inline-block; 
    float: none; 
    vertical-align: top; 
} 

/* Nav links */ 
.navbar-default .navbar-nav > li > a { 
    padding-top: 10px; 
    padding-bottom: 10px; 
} 

/* Nav hover */ 
.navbar-default .navbar-nav > li > a:hover, 
.navbar-default .navbar-nav > li > a:focus { 
    background: none; 
} 

/* Nav active */ 
.navbar-default .navbar-nav > .active > a, 
.navbar-default .navbar-nav > .active > a:hover, 
.navbar-default .navbar-nav > .active > a:focus { 
    background: none; 
} 

/* Nav reset */ 
.navbar { 
    background: none; 
    border: none; 
    -webkit-border-radius: 0; 
    -moz-border-radius: 0; 
    border-radius: 0; 
} 
.navbar-default { 
    background: none; 
    border: none; 
    -webkit-border-radius: 0; 
    -moz-border-radius: 0; 
    border-radius: 0; 
}

来源

2016-09-06 Patrick Dejour II

我很欣赏所有的回应。通过将@timelsass中的代码添加到内置的自定义CSS编辑器中，我可以使“汉堡图标”显示出来。多谢你们！ –

我的烦恼遗憾的菜单按钮您正在使用BoldGrid度假主题！我用这个主题研究了这个问题，并意识到在sass调色板文件中有硬编码的值会导致您遇到问题。在我们的主题的下一个版本中，我已经解决了这个问题，以便其他人也可以在此处修复此问题：https://github.com/BoldGrid/vacation/commit/0ce7953e1f4fa1fe866db4ede290cc2e2d31036a

这将使切换菜单和图标栏的颜色为＃545454（深灰色）或#fff （白色），这取决于调色板中第一种颜色使用哪种颜色。在你的情况下，颜色是白色的，所以图标和条纹将是深灰色。

由于您希望使这些红色显示在您的调色板中，因此每次更新主题时确保您的更改保持原位的最佳方法是使用WordPress定制程序中的自定义CSS编辑器。

您可以访问定制器，然后点击高级>定制JS & CSS，然后点击“打开编辑器”按钮。

如果您以前从未使用过此功能，那么您可以擦除一个CSS代码片段。

您可以复制并粘贴此代码：

.palette-primary .navbar-default .navbar-toggle { 
    border-color: #960000; 
} 
.palette-primary .navbar-default .navbar-toggle .icon-bar { 
    background-color: #960000; 
} 
.palette-primary .navbar-default .navbar-toggle:hover, 
.palette-primary .navbar-default .navbar-toggle:focus { 
    background-color: #960000; 
} 
.palette-primary .navbar-default .navbar-toggle:hover .icon-bar, 
.palette-primary .navbar-default .navbar-toggle:focus .icon-bar { 
    background-color: #fff; 
}

然后点击右上角的X按钮，然后按保存&发布，如果你的预览看起来你想要的方式。

这会确保您的自定义CSS在您更新主题时保持原样，以防我们进行任何可能与您自己的自定义样式冲突的样式更改。

来源

2016-09-07 15:05:45

这是因为颜色实际上是用背景颜色处理的......下面的样式是控制这些线条颜色的东西。当您想要覆盖引导程序样式时，您需要确保使用适当的类结构。

.palette-primary .navbar-default .navbar-toggle .icon-bar, .palette-primary .navbar-default .navbar-toggle:hover, .palette-primary .navbar-default .navbar-toggle:focus { 
    background-color: #fff; 
}

来源

2016-09-06 22:40:04

你称为三线被称为汉堡包图标

添加或覆盖CSS规则之下在你的CSS

.palette-primary .navbar-default .navbar-toggle .icon-bar, .palette-primary .navbar-default .navbar-toggle:hover, .palette-primary .navbar-default .navbar-toggle:focus { background-color: #960000; }

来源

2016-09-06 22:45:25

如何使移动wordpress网站上的菜单按钮可见？

回答

相关问题