動態複選框CSS和引導

Question

我想替換自定義圖像，而不是標準複選框，我嘗試了很多方法，但我無法，我已經使用：檢查。以下是示例代碼。

<label class="checkbox-inline"> 
    <img src="assets/settings.png" alt="" width="70px;"/> 
    <input type="checkbox" id="inlineCheckbox3" value="option3" id="cjecg"> &nbsp; 
</label> 

我有4個這樣的複選框，我希望它們在檢查時用其他圖像替換。

Answer 1

演示，請參閱：https://jsfiddle.net/IA7medd/s5L02bck/

HTML：

<p class="checkbox-inline"> 
    <input type="checkbox" class="inlineCheckbox" value="option3" id="cb1"> 
    <img src="https://cdn3.iconfinder.com/data/icons/google-material-design-icons/48/ic_settings_48px-128.png" alt="" width="70px;"/> 
    <label for="cb1"> Option 1 </label> 
</p> 

您將使用：檢查這樣

.inlineCheckbox:checked{ 
    display:none; 
} 
.inlineCheckbox:checked + img{ 
    display:inline-block; 
}