ElMessageBox.confirm 的 css

ElMessageBox.confirm 的 css 样式可以在以下三个地方进行修改：

1. 全局配置：

在 main.js 中使用 Vue.use(ElementUI) 引入 ElementUI 后，可以使用以下代码修改全局配置：

Vue.prototype.$confirm = function (message, title, options) {
  return ElMessageBox.confirm(message, title, Object.assign({
    confirmButtonText: '确定',
    cancelButtonText: '取消',
    type: 'warning',
  }, options))
}

其中，confirmButtonText 和 cancelButtonText 可以分别修改确认按钮和取消按钮的文字，type 可以修改提示框的类型。

2. 单个 confirm 弹框：

在单个 confirm 弹框中，可以使用以下代码修改样式：

<el-button @click="showConfirm">显示 confirm 弹框</el-button>

<el-dialog
  :visible.sync="dialogVisible"
  title="提示"
  :show-close="false"
>
  <span>这是一条消息</span>
  <span slot="footer" class="dialog-footer">
    <el-button @click="dialogVisible = false">取消</el-button>
    <el-button type="primary" @click="dialogVisible = false">确定</el-button>
  </span>
</el-dialog>

<style>
.el-button--primary {
  background-color: #409EFF;
  border-color: #409EFF;
}

.el-button--primary:hover {
  background-color: #66b1ff;
  border-color: #66b1ff;
}

.el-button--default {
  border-color: #dcdfe6;
  color: #606266;
}

.el-button--default:hover {
  color: #409EFF;
  border-color: #409EFF;
}
</style>

<script>
export default {
  data() {
    return {
      dialogVisible: false,
    }
  },
  methods: {
    showConfirm() {
      this.dialogVisible = true
    },
  },
}
</script>

其中，通过样式修改了确认按钮和取消按钮的背景色和边框颜色。

3. 修改全局样式：

在项目的样式文件中，可以通过以下代码修改全局样式：

.el-button--primary {
  background-color: #409EFF;
  border-color: #409EFF;
}

.el-button--primary:hover {
  background-color: #66b1ff;
  border-color: #66b1ff;
}

.el-button--default {
  border-color: #dcdfe6;
  color: #606266;
}

.el-button--default:hover {
  color: #409EFF;
  border-color: #409EFF;
}

其中，通过样式修改了确认按钮和取消按钮的背景色和边框颜色。这种方式会全局生效，如果只想修改单个 confirm 弹框的样式，建议使用第二种方式。