HTML5 带有输入或输入 IN 标签的结构标签

Question

哪个更合适？

第一个：

<div>
<label for="male">Male</label>
<input type="radio" name="gender" id="male" value="male">
</div>

第二个：

<label for="male">Male
<input type="radio" name="gender" id="male" value="male">
</label>

它们也能正常工作，但我不确定第二个选项是否适用于所有 html 结构。

Answer 1

两个选项都有效 HTML the w3 spec 并且 for 在第二种形式中不是强制性的。

使用您喜欢的任何一个。

Answer 2

我会像这样将输入放在标签内，不会使用外部 div 包装器：

<label for="male">Male
   <input type="radio" name="gender" id="male" value="male">
</label>

通过这种方式，当点击标签文本时，输入会获得焦点 Male。

HTML5 structure label with input OR input IN label