css 单选框默认被选中

CSS 单选框默认被选中是很重要的，可以使用户更方便地了解当前选项。在本文中，我们将介绍如何使用 CSS 实现单选框默认被选中的效果。

  /* HTML 代码 */  input type="radio" name="radio-group" id="radio-1" checked="checked" />
      label for="radio-1">
    选项1/label>
      input type="radio" name="radio-group" id="radio-2" />
      label for="radio-2">
    选项2/label>

在上面的 HTML 代码中，我们通过给第一个单选框添加 checked="checked" 属性来使其默认被选中。我们使用了 label 元素和 for 属性来使标签与相应的单选框关联。

  /* CSS 代码 */  input[type="radio"]:checked + label {
        /* 添加选中样式 */    font-weight: bold;
        color: #ff0000;
  }
    

在上面的 CSS 代码中，我们使用了 :checked 伪类选择器来选中被选中的单选框，然后使用+选择器来选中相邻的 label 元素，添加选中样式。

使用 CSS 实现单选框默认被选中非常简单，只需在 HTML 中添加 checked="checked" 属性即可。如果您遇到任何问题，请参考本文示例代码或搜索网络上的其他资源。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！