element ui的确认提示框按钮样式修改

修改确认提示框的默认按钮样式,使用css强制修改

例:

js代码:

javascript 复制代码
deleteUser(params){
    this.$confirm("您确定要删除吗?此操作无法撤销并且将永久删除所有数据。", "提示", 
        { type: "warning", cancelButtonClass: "user-cancel", confirmButtonClass: "user-confirm" })
        .then(() => {});
}

css代码:

css 复制代码
.el-message-box .el-message-box__btns .user-cancel {
  color: #FFFFFF;
  background: #1890ff;
  border-color: #1890ff;
}

.el-message-box .el-message-box__btns .user-cancel:hover {
  background: #46a6ff;
  border-color: #46a6ff;
}

.el-message-box .el-message-box__btns .user-confirm{
  background: #ffffff;
  color: #606266;
  border: 1px solid #DCDFE6;
  zoom: 0.8;
} 

.el-message-box .el-message-box__btns .user-confirm:hover {
  background: #e8f4ff;
  border-color: #badeff;
}
相关推荐
风骏时光牛马5 小时前
前沿视界
前端
kyriewen5 小时前
我扫了 814 个依赖,97 个还敢要 Node 10
前端·javascript·程序员
陈随易5 小时前
3000 万人在用的翻译插件,重写一遍就是一门生意
前端·后端·程序员
IT_陈寒5 小时前
Vue的这个响应式陷阱,差点让我加班到天亮
前端·人工智能·后端
程序员大阳6 小时前
HTML+CSS+JS对话式实战(9)-项目总结与问题分析
javascript·css·html·实战·项目总结
Flynt6 小时前
别写拖拽行为,只声明"能拖到哪":UIST 最佳论文的拖拽方案我实测了
前端·svg·preact
Moment7 小时前
代码都能让 Agent 写了,我们为什么还要学前端?
前端·后端·面试
Hilaku7 小时前
MCP 协议会成为前端 AI 工程的标准接口吗?
前端·javascript·程序员
Zan7 小时前
Tauri 2 实战:为什么一个可靠的桌面应用,应该由 Rust Host 管理生命周期?
前端·架构·rust
SameX8 小时前
鸿蒙 ArkTS 独立开发者的项目结构 model / dao / viewmodel / page / common 的分层
前端