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;
}
相关推荐
lichenyang4531 小时前
NestJS + Socket.IO 鉴权、用户房间与幂等邀请
前端·后端
paopaokaka_luck1 小时前
基于springboot3+vue3+uniapp的剧本杀预约小程序(AI角色对话、协同过滤算法、地图Api、Echarts图形化分析)
java·前端·spring boot·学习·echarts
lichenyang4531 小时前
React 实时通知与异步竞态处理
前端·后端
三十而立洋1 小时前
搭建现代化 Git 提交规范:commitlint + czg + husky + lint‑staged 完整实战
前端
半个落月1 小时前
React + Vite Todo 实践:用 Axios 与 Mock 解开前后端等待
前端
qq_316837751 小时前
uniapp 安卓/H5 使用 contentEditable 属性 富文本编辑器
android·javascript·uni-app
yuqifang1 小时前
var deferred = jQuery.Deferred(); 使用示例
前端·javascript·面试
阳火锅1 小时前
领导夸我日报越写越详细了,其实我只敲了 npm run commit
前端·javascript·人工智能
lichenyang4531 小时前
实时团队邀请的架构与数据流
前端·后端
一鸣AI编程1 小时前
AI UI 测试平台从 0 到 1:8 次跑通一条 19 步用例的实战复盘
前端