2024年4月12日发(作者：)

修改radio选中的中间圆点样式

举个例子，你可以这样写CSS来修改radio选中的中间圆点样

式：

css.

input[type="radio"] {。

-webkit-appearance: none;

-moz-appearance: none;

appearance: none;

border: 2px solid #999;

border-radius: 50%;

width: 20px;

height: 20px;

transition: 0.2s all linear;

}。

input[type="radio"]:checked {

border-color: #007bff;

}。

input[type="radio"]::before {

content: "";

display: block;

width: 10px;

height: 10px;

。

。

margin: 4px;

border-radius: 50%;

transition: 0.2s all linear;

}。

input[type="radio"]:checked::before {。

background: #007bff;

}。

在这个例子中，我们首先将原生的radio样式通过`-webkit-

appearance`和`-moz-appearance`设置为`none`，然后自定义了未

选中和选中状态的圆点样式。未选中状态下，圆点是灰色的边框，

选中状态下，圆点是蓝色的实心圆点。

当然，你也可以根据自己的需要调整圆点的大小、颜色和其他

样式属性来实现不同的效果。希望这个回答能够帮到你。