Question

嗨，伙计们，我正在用一些单选按钮和引导程序制作这个表单，但是我不喜欢它们看起来的方式：

这是我的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>

使这个radiobutton看起来更好

1 个答案: