Question

我被证明通常有两种标记radio按钮的方法：

方法＃1：

<label>Male<input type="radio" name="gender" value="m"></label>
<label>Female<input type="radio" name="gender" value="f"></label>

方法＃2（使用for）：

<label for="id_male">Male</label>
<input type="radio" id="id_male" name="gender" value="m">
<label for="id_female">Female</label>
<input type="radio" id="id_female" name="gender" value="f">

但是，如果需要将一组radio按钮与label相关联，该怎么办？

即：

<label>What is your gender?
    <label>Male<input type="radio" name="gender" value="m"></label>
    <label>Female<input type="radio" name="gender" value="f"></label>
</label>

问题是：

用于关联＆＃34;您的性别是什么的方式？＆＃34; label以上是否正确？
有没有办法联系＆＃34;你的性别是什么？＆＃34;对应于方法＃2（即使用for）？

Answer 1

使用方法＃2：

＆＃13;

<form action="" method="post">
  <fieldset>
    <legend>What's your gender?</legend>
      <label for="id_male">Male</label>
      <input type="radio" id="id_male" name="gender" value="m">
      <label for="id_female">Female</label>
      <input type="radio" id="id_female" name="gender" value="f">
  </fieldset>
</form>

＆＃13;

详细了解fieldset

Answer 2

一个好的解决方案是使用 fieldset / legend 组合：

<form>
  <fieldset>
    <legend>Gender</legend> 
    <input type="radio" name="gender" value="male" checked> Male<br>
    <input type="radio" name="gender" value="female"> Female<br>
    <input type="radio" name="gender" value="other"> Other
  </fieldset>
</form>

这里是fiddle

如何将标签与一组单选按钮相关联？

2 个答案: