將此RADIOBUTTON更好看

Question

嗨，大家好，我做這種形式與一些單選按鈕和引導，但單選按鈕，我不喜歡他們的樣子：

radio buttons

，這是我的html代碼：

<div class="form-group"> 
    <label>Memoria SD: 
    <br> 
    <input type="radio" id="memorias" name="memoria" value="si">SI 
    </label> 
    <label> 
    <input type="radio" id="memorian" name="memoria" value="no" checked="true">NO 
    </label> 
</div> 
<div class="form-group"> 
    <label>SIM Card: 
    <br> 
    <input type="radio" id="chips" name="chip" value="si">SI 
    </label> 
    <label> 
    <input type="radio" id="chipn" name="chip" value="no" checked="true">NO 
    </label> 
</div> 
<div class="form-group"> 
    <label>Tapa: 
    <br> 
    <input type="radio" id="tapas" name="tapa" value="si" checked="true">SI 
    </label> 
    <label> 
    <input type="radio" id="tapan" name="tapa" value="no">NO 
    </label> 
</div> 

我希望所有排列這樣 （x）的SI（）NO （x）的SI（）NO （x）的SI（）否

單選按鈕

它是不是此刻的方式： （x）的SI（）NO （x）的SI（）NO （x）的SI（）否

Answer 1

這是因爲你的<label>圍繞您的字幕組包裹。 <label>適用於個人輸入。

試試這個：

<div class="form-group"> 
    Memoria SD:<br> 
    <input type="radio" id="memorias" name="memoria" value="si">SI 
    <input type="radio" id="memorian" name="memoria" value="no" checked="true">NO 
</div> 

<div class="form-group"> 
    SIM Card:<br> 
    <input type="radio" id="chips" name="chip" value="si">SI 
    <input type="radio" id="chipn" name="chip" value="no" checked="true">NO 
</div> 

<div class="form-group"> 
    Tapa:<br> 
    <input type="radio" id="tapas" name="tapa" value="si" checked="true">SI 
    <input type="radio" id="tapan" name="tapa" value="no">NO 
</div>