我的項目中的html頁面中的RadioButton錯誤頁面

-1

我有兩個複選框，其中有背景圖片。當我刪除這些背景圖像特性時，複選框不顯示。任何人都可以解決這個問題嗎？我的項目中的html頁面中的RadioButton錯誤頁面

請找我的代碼中的JS提琴here

HTML：

<table id="rbtnsslEnabled" class="chkMargin"> 
    <tbody> 
     <tr> 
      <td> 
       <input id="rbtnsslEnabled_0" type="radio" name="rbtnsslEnabled" value="SSL" /> 
       <label for="rbtnsslEnabled_0">SSL</label> 
      </td> 
     </tr> 
     <tr> 
      <td> 
       <input id="rbtnsslEnabled_1" type="radio" name="rbtnsslEnabled" value="TLS" /> 
       <label for="rbtnsslEnabled_1">TLS</label> 
      </td> 
     </tr> 
    </tbody> 
</table>

CSS：

table { 
    width: 100% !important; 
    border: none; 
    table-layout: fixed; 
} 
input[type=checkbox]:not(old), input[type=radio]:not(old) { 
    width: 40px; 
    margin: 0; 
    padding: 0; 
    opacity: 0; 
} 
input[type=checkbox]:not(old) + label, input[type=radio]:not(old) + label { 
    display: inline-block; 
    margin-left: -28px; 
    padding-left: 28px; 
    background: url('http://s6.postimg.org/4e4im9vkt/checks.png') no-repeat 0 0; 
    padding-bottom: 4px; 
} 
input[type="radio"], input[type="checkbox"] { 
    margin: 4px 0 0; 
    margin-top: 1px \9; 
    line-height: normal; 
} 
input[type=radio]:not(old):checked + label { 
    background-position: 0 -24px; 
}

來源

2015-01-07 droidev

這下面的CSS是有意隱藏（默認）單選按鈕：

input[type=checkbox]:not(old), input[type=radio]:not(old) { 
    width: 40px; 
    margin: 0; 
    padding: 0; 
    opacity: 0; 
}

專門

opacity: 0;

其目的是給你看中了「綠色複選框」式的單選按鈕。由於默認按鈕是隱藏的，背景是代替按鈕，所以隱藏背景，現在也隱藏了按鈕。如果您只想使用普通單選按鈕，請刪除opacity: 0;風格fiddle，或者甚至整個塊（fiddle）

來源

2015-01-07 06:24:48 chiliNUT

我的項目中的html頁面中的RadioButton錯誤頁面

回答

相關問題