Vue ElementUI el-button 修改样式
el-button这里以 危险样式为例:<el-button type="danger">危险按钮</el-button>.el-button--danger {height:30px;line-height: 0.4;background-color:#c13030;border:1px solid #f57d7d;border-radius:1px;span {font
·
这里以 危险样式按钮 为例:
<el-button type="danger">危险按钮</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;
更多推荐
已为社区贡献33条内容
所有评论(0)