如何使移動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網站上的菜單按鈕可見？

回答

相關問題