给elementUI中el-button加宽高背景颜色，大小设置，去掉默认颜色边框,园角度

1.尺寸大小设置

设置宽高需要把尺寸改为最小给el-button加size=“mini” 就可以设置宽高了width height

2.背景颜色 ( 默然样色类型 type=“primary” )

(1) 想要改变背景颜色 style="background: #fb435f" 就出现背景颜色 ，但是本身有默认颜色边框他的primary
el-button外面div加个名 .bg_btn >>> .el-button--primary { border: none; } 加这个就可以去掉默认边框

(2) 加背景颜色方法:

  .bg_btn button { width: 41px; height: 18px; background: #fb435f; } .bg_btnbutton:first-child { background: #0cc87e; } 
 

3.字体大小

 .bg_btn span { position: relative; bottom: 5px; right: 5.2px; }
 

有默认边框

去掉后

4.去掉圆角度,加这个样式.el-button–mini这个class名在f12审查元素可查看

.bg_btn .el-button--mini {border-radius: inherit;
 }
 

去掉前

去掉后

5.源码

 
忽略购买
.bg_btn {display: flex;flex-direction: row;margin-top: 10px;margin-left: 40%;width: 50%;height: 27px;
 }
 .bg_btn >>> .el-button--primary {border: none;
 }
 .bg_btn button {width: 41px;height: 18px;font-family: SourceHanSansCN-Regular;font-size: 12px;font-weight: normal;color: #ffffff;position: relative;left: 20%;background: #fb435f;
 }
 .bg_btn button:first-child {background: #0cc87e;
 }
 .bg_btn span {position: relative;bottom: 5px;right: 5.2px;
 }
 .bg_btn .el-button--mini {border-radius: inherit;
 }