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

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

例:

js代码:

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

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;
}

相关推荐

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-05-10 18:42:05       98 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-05-10 18:42:05       106 阅读
  3. 在Django里面运行非项目文件

    2024-05-10 18:42:05       87 阅读
  4. Python语言-面向对象

    2024-05-10 18:42:05       96 阅读

热门阅读

  1. vue常见**MS题

    2024-05-10 18:42:05       29 阅读
  2. 实习记录——day01-day03

    2024-05-10 18:42:05       29 阅读
  3. Milvus基本概念及其应用场景

    2024-05-10 18:42:05       23 阅读
  4. PYTHON做题复盘

    2024-05-10 18:42:05       32 阅读
  5. 嵌入式交叉编译:Unable to find arm_neon.h

    2024-05-10 18:42:05       31 阅读
  6. 微信小程序下载文件详解

    2024-05-10 18:42:05       35 阅读
  7. QT--1

    QT--1

    2024-05-10 18:42:05      29 阅读
  8. docker 和 docker-compose

    2024-05-10 18:42:05       31 阅读
  9. leetcode 2105. 给植物浇水 II

    2024-05-10 18:42:05       32 阅读