如何在移动wordpress网站上显示菜单按钮?

时间:2016-09-06 22:30:46

标签: css wordpress mobile themes

我正在使用BoldGrid的一个名为Vacation的主题,它有一些我编辑过的css但是由于某种原因我无法在手机上更改菜单按钮(你点击完整菜单的三行)为红色(#960000)和白色(#fff)。我有什么想法我做错了吗?我应该在哪里输入颜色代码?现在这三条线在被点击之前是不可见的。

echo CALLEE: Passed argument:   "%~1"
echo CALLEE: Original variable: "%VAR%"
set "VAR=bar"
echo CALLEE: Modified variable: "%VAR%"
exit /B

3 个答案:

答案 0 :(得分:1)

对于您在BoldGrid Vacation主题中遇到的麻烦,我感到很抱歉!我用这个主题调查了这个问题,并意识到sass颜色调色板文件中有硬编码的值会导致问题。在我们下一个主题版本中,我已经解决了这个问题,所以其他人也可以在此处修复此问题:https://github.com/BoldGrid/vacation/commit/0ce7953e1f4fa1fe866db4ede290cc2e2d31036a

这将使切换菜单和图标栏的颜色为#545454(深灰色)或#fff(白色),具体取决于调色板中第一种颜色的颜色。在你的情况下,颜色是白色,所以图标和条纹将是深灰色。

由于您希望将这些红色设置为调色板中使用的红色,因此在更新主题时确保更改保持不变的最佳方法是在WordPress定制器中使用自定义CSS编辑器。

您可以通过转到定制程序,然后转到高级>来访问它。定制JS&然后单击CSS,然后单击“Open Editor”按钮。

如果您之前从未使用过此功能,那么您可以删除一个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按钮,然后按Save&如果您的预览看起来像您想要的那样,则发布。

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

答案 1 :(得分:0)

这是因为颜色实际上是用背景颜色处理的......下面的样式控制着这些线条的颜色。当你想要覆盖引导样式时,你需要确保使用正确的类结构。

.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;
}

答案 2 :(得分:0)

您称为三行的菜单按钮称为汉堡图标

在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; }