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

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> 

的问题是： “你的性别是”

1. 是用于关联的方式label以上，正确？

2. 有没有办法将“你的性别？”关联起来对应于方法＃2（即使用for）？

Answer 1

使用方法＃2是这样的：

<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>

查看更多有关fieldset

Answer 2

一个好的解决方案是使用字段集/图例组合：

这是fiddle