radio-group 按钮样式

radio-group 按钮样式可以通过 CSS 来自定义。以下是一个简单的示例：

HTML 代码：

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

CSS 代码：

.radio-group input[type="radio"] {
  display: none;
}

.radio-group label {
  display: inline-block;
  margin-right: 10px;
  padding: 5px 10px;
  border: 1px solid #ccc;
  border-radius: 3px;
  cursor: pointer;
}

.radio-group input[type="radio"]:checked + label {
  background-color: #3f51b5;
  color: #fff;
}

在这个示例中，我们将 radio 按钮的 display 属性设置为 none，然后使用 label 标签来代替按钮，并将它们设置为可点击的。我们还设置了标签的样式，包括边框、圆角、填充和光标样式。最后，我们使用 CSS 伪类 :checked 来设置选中标签的样式。