Vue ElementUI el-button 修改样式

el-button

这里以 危险样式按钮 为例：

<el-button type="danger">危险按钮</el-button>

下面是修改，使用 css 预处理语言 stylus，span 是文字样式

      1. .el-button--danger {

  2.     height:30px;

  3.     line-height: 0.4;

  4.     background-color:#c13030;

  5.     border:1px solid #f57d7d;

  6.     border-radius:1px;

  7.     span {

  8.         font-family:Microsoft YaHei UI;

  9.         color:#fff;

  10.         font-size:14px;

  11.         letter-spacing:1px;

  12.     }

  13. }

修改前：

修改后：

说明：

1、示例的 type="danger" ，所以 class name 是 el-button--danger；

2、同理，如果是 primary / success / warning / info / text，则 class name 是 el-button-- primary 等；

3、如果不设置 type，class name 就改为 el-button;