Html複選框：更改顏色

在開發.NET應用程序期間，我遇到了一個問題。Html複選框：更改顏色

我想要做的，是要改變一個簡單的HTML複選框的背景顏色，所以我用下面的HTML代碼：

<input type="checkbox" id="check1" style="background-color: yellow" />

此代碼只能與OPERA，而不是與其他瀏覽器（瀏覽器，火狐，資源管理器）

所以我也用Javascript代碼：

document.getElementById("check1").style.backgroundColor = "yellow"

和JQuery sintax：

$("#check1").css("background-color", "yellow")

但結果是一樣的。

如果我使用HTML文本框，此代碼有效。

有人可以幫我嗎？

來源

2013-07-02 user2217039

http://stackoverflow.com/questions/7398462/css-background-color-attribute-not-working-on-checkbox-inside-div貌似沒有與火狐，Chrome和Safari的問題禁止這一點。做了一個快速搜索，沒有看到解決方案。 –

檢查我的答案 –

更改複選框本身的唯一方法是對複選框Ex [在CSS-Tricks]上進行圖像替換（http://css-tricks.com/snippets/css/custom-checkboxes-and-無線電按鈕/） –

將每個複選框換成div，然後更改div的背景色。

因此，它應該是這樣的：

<div style="background-color: yellow;"> 
<input type="checkbox" /> 
</div> 
<div style="background-color: red;"> 
<input type="checkbox" /> 
</div> 
<div style="background-color: green;"> 
<input type="checkbox" /> 
</div>

Demo.

來源

2013-07-02 18:20:47

這在技術上不是OP想要的，但是可以做到最接近的事情。 –

要麼是或替換複選框的圖像 – casraf

即使在新戲將無法工作，所以我建議用一個div容器來包裝它。

<div id="check1_Container"> 
<label for="check1">Check box 1</label> 
<input type="checkbox" id="check1" style="background-color: yellow" /> 
</div>

來源

2013-07-02 18:41:45 bunjeeb

爲什麼要使用jQuery？ –

完全正確，我剛剛刪除它。我剛纔提到過，如果你想在運行時改變基於某種邏輯的風格 – bunjeeb

Html複選框：更改顏色

回答

相關問題