单选框

在HTML 5中，单选框是一种表单控件，允许用户在一组选项中选择其中之一。单选框使用<input>元素的type="radio"属性来定义。

下面是一个简单的单选框示例：

<form>
  <input type="radio" name="gender" value="male"> Male
  <input type="radio" name="gender" value="female"> Female
</form>

在上面的示例中，我们创建了一个包含两个单选框的表单。这两个单选框都有相同的name属性值，这样它们就属于同一个单选按钮组。用户只能选择其中之一。

在上面的示例中，我们还给每个单选框定义了一个value属性，当用户选择一个单选框时，该单选框的value属性值将被提交给服务器。

你也可以使用checked属性来默认选中一个单选框：

<form>
  <input type="radio" name="gender" value="male"> Male
  <input type="radio" name="gender" value="female" checked> Female
</form>

如果你需要创建一个垂直排列的单选框组，可以使用<br>标签或者CSS来实现：

<form>
  <input type="radio" name="gender" value="male"> Male <br>
  <input type="radio" name="gender" value="female"> Female
</form>

当用户提交表单时，可以使用JavaScript来获取用户选择的单选框的值：

<form id="myForm">
  <input type="radio" name="gender" value="male"> Male
  <input type="radio" name="gender" value="female"> Female
  <button type="button" onclick="getSelectedGender()">Submit</button>
</form>

<script>
  function getSelectedGender() {
    var gender = document.querySelector('input[name="gender"]:checked').value;
    alert('Selected gender: ' + gender);
  }
</script>

在上面的示例中，我们通过JavaScript获取用户选择的单选框的值，并弹出一个包含所选值的对话框。

这就是HTML 5中使用单选框的基础知识。希望这个教程对你有帮助！