element-ui之改变el-switch开关组件的大小

一、需求 通过css改变el-switch大小
二、功能实现

.el-switch__core { width: 30px !important; height: 16px; } .el-switch__core::after { width: 14px; height: 14px; margin-top: -1px; } .el-switch.is-checked .el-switch__core::after{ margin-left: -15px; }

【element-ui之改变el-switch开关组件的大小】原效果:
element-ui之改变el-switch开关组件的大小
文章图片

修改后效果:
element-ui之改变el-switch开关组件的大小
文章图片

    推荐阅读