圖標背景顏色也改變按鈕的顏色。 JQM 1.4.0

我嘗試將圖標的背景顏色設置爲綠色而不是默認淺灰色，但它也會更改整個按鈕的背景。我怎樣才能防止這一點？我只想讓圖標改變顏色。圖標背景顏色也改變按鈕的顏色。 JQM 1.4.0

jQuery Mobile的1.4.0

<div data-role="footer" data-position="fixed" data-tap-toggle="false"> 
    <div data-role="navbar"> 
     <ul> 
      <li><a href="#start" data-icon="home">Start</a></li> 
      <li><a href="#" data-icon="check">Test</a></li> 
     <li><a href="#" data-icon="gear">Test2</a></li> 
     </ul> 
    </div><!-- /navbar --> 
</div><!-- /footer -->

CSS

.ui-icon-check 
{ 
    background-color: #0f0 !important; 
}

UPDATE： 的：後關鍵字解決它！由於這個頁面是動態的，我想它需要應用CSS而不是「之前」？

工作CSS（感謝奧馬爾）

.ui-icon-check:after 
{ 
    background-color: green !important; 
}

來源

2014-02-28 Baked Inhalf

我們沒有足夠的信息。我懷疑你的圖標是圖像，所以你可能無法改變它們的顏色。您正在使用圖標字體，您需要更改該字體的「顏色」。 –

嘗試僞選擇器'：之後'。 '的.ui圖標檢查：after'。 – Omar

這都是標準的jQuery Mobile。沒有自定義圖標。我嘗試更改** ui-icon-check **圖標。我做了一個小提琴，它似乎工作在1.3，但我使用1.4.0版本 –

jQuery用戶界面圖標設置顏色，如果你想改變顏色，你需要使用一個圖像編輯程序，這樣做（根據到jQuery mobile ui網站的源文件）。

解決這個另一種方法是使用基於圖標的字體如font-真棒並使用CSS像這樣：

.ui-icon-check{ 
    color:#FFF; /* Change to Desired Color Hex (Or RGBA) */ 
}

裏面居然最終被

<span class='fa fa-check'/>

我相信。

我想補充的附加類

<span class='fa fa-check my_icon_class' />

，並使用

.my_icon_class{ 
    color:#FFF; 
}

爲了安全起見，並沒有亂了原來實行的字體真棒代碼。

來源

2014-05-28 20:51:50 DrewRobertson93

無需進行圖像編輯，只需使用CSS更改顏色 –

圖標背景顏色也改變按鈕的顏色。 JQM 1.4.0

回答

相關問題