CSS修改單選框樣式（element）

1.簡單的修改顏色

原樣式：

 

 修改后：

HTML代碼：

<el-radio-group v-model="newlyAdded.discount">
   <el-radio label="0">工品</el-radio>
   <el-radio label="1">供應商</el-radio>
</el-radio-group>

CSS代碼：

需要先獲取在element中 單選框的class名稱。

.el-radio__input.is-checked .el-radio__inner {//單選框選擇按鈕背景樣式
    border-color: #409EFF;
    background: #FFF;
}
.el-radio__inner::after {//按鈕內圖案樣式
    width: 7px;
    height: 7px;
    background-color: #409EFF;
}

注意：主要查看一下當前樣式名稱是否更換，可能會因為版本的更換而更改名稱

如果是簡單的修改內部圖案都可以使用該方法：

2.銅錢樣式

 

 HTML代碼同上

CSS代碼：

.el-radio__input.is-checked .el-radio__inner {//單選框選擇按鈕背景樣式
    border-color: #409EFF;
    background: #FFF;
}
.el-radio__inner::after {//按鈕內圖案樣式
 width: 7px; height: 7px; background-color: #409EFF; }

.el-radio__input.is-checked .el-radio__inner::after {

     border-radius: 0px;

}