cssradio单选不重复

如果你想要实现 CSS 单选不重复的效果，可以使用 `:checked` 伪类和同级元素的 `+` 或者 `~` 选择器。例如：

HTML 代码：

<div class="radio-group">
  <input type="radio" name="radio" id="radio1" value="1">
  <label for="radio1">选项1</label>
  <input type="radio" name="radio" id="radio2" value="2">
  <label for="radio2">选项2</label>
  <input type="radio" name="radio" id="radio3" value="3">
  <label for="radio3">选项3</label>
</div>

CSS 代码：

/* 隐藏所有 radio */
.radio-group input[type="radio"] {
  display: none;
}

/* 显示选中 radio 对应的 label */
.radio-group input[type="radio"]:checked + label {
  background-color: #ccc;
}

/* 显示非选中 radio 对应的 label */
.radio-group input[type="radio"] + label {
  background-color: #fff;
}

/* 防止选中 radio 非同级元素的 label */
.radio-group input[type="radio"]:checked ~ label {
  background-color: #fff;
}

这样就可以实现单选不重复的效果了。