Vue ElementUI el-button 修改样式

el-button

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

危险按钮

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

.el-button--danger {
    height:30px;
    line-height: 0.4;
    background-color:#c13030;
    border:1px solid #f57d7d;
    border-radius:1px;
    span {
        font-family:Microsoft YaHei UI;
        color:#fff;
        font-size:14px;
        letter-spacing:1px;
    }
}

修改前：

修改后： 

 

说明：

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;