jQuery用戶界面按鈕填充倍率

HTML標記如下：jQuery用戶界面按鈕填充倍率

<button id="Refresh"><img src="refresh.png" /></button>

我建立這個按鈕如用下面的代碼一個jQuery用戶界面按鈕：

$("#Refresh").button();

調用此函數產生以下標記：

<button id="Refresh" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button" aria-disabled="false"> 
    <span class="ui-button-text"> 
     <img src="refresh.png"> 
    </span> 
</button>

這工作正常。結果是在jquery的CSS中定義了一個填充爲.4em 1em;的按鈕。（.ui-button-text-only .ui-button-text）

我在這個頁面上有幾個按鈕，我喜歡這個填充大部分。但是，特別是這一個按鈕，我想沒有填充。我意識到我可以改變CSS爲.ui-button-text-only和.ui-button-text，但這會使用這種風格搞砸其他按鈕，我喜歡他們的方式。

所以我想知道是否有任何方法可以重寫此css 只需一個按鈕。我看了一下jquery's button docs，但它似乎沒有允許使用按鈕選項傳遞特定的CSS。

在此先感謝您的幫助！

來源

2012-06-07 Mansfield

您是否嘗試過在創建按鈕後添加類？ –

@JoshMein你的意思是試圖重寫jQuery的css類嗎？如果是這樣，是不是隻是重寫其他按鈕的CSS？ – Mansfield

我打算給該特定按鈕添加一個類。看看下面的答案。 –

您只需添加一個新的類跨度按鈕內創建後。

$("#Refresh").button(); 
$("#Refresh").find('span.ui-button-text').addClass('yourClass');

來源

2012-06-07 15:47:01

你可以簡單地使用CSS來設計它。爲了確保它不會覆蓋附加「！重要」

添加span標籤

#Refresh span { 
    padding:0 !important; 
}

來源

2012-06-07 15:44:58 Thomas

不幸的是，這似乎並不奏效。我的猜測是因爲它實際上並不是#Refresh風格，但是跨度jquery創建。 – Mansfield

試試我編輯的@Thomas的代碼 – Ateszki

使用像'button＃Refresh span.ui-button-text'這樣的選擇器，它將按預期工作。 –

jQuery用戶界面按鈕填充倍率

回答

相關問題