element修改单个ElMessageBox样式，不影响全局样式

 ElMessageBox.alert(
    "哈哈哈<span>，有有有!</span>","提示",
     {
       showCancelButton: true,
       confirmButtonText: '确定',
       cancelButtonText: '取消',
       customClass: "messageStyle",
       cancelButtonClass: 'messageCancelBtn',
       confirmButtonClass: 'messageConfirmBtn',
       dangerouslyUseHTMLString: true,
    }
);

 

注意：<style> 里不加scope

<style lang="scss">
.messageStyle {
  padding-bottom: 0 !important;
  border: none !important;

  .el-message-box__header {
    .el-message-box__title {
      color: red !important;
      font-size: 1.5rem !important;
      font-weight: 600;
    }
  }

  .el-message-box__content {
    color: #000;
    .el-message-box__container {
      .el-message-box__message span {
        color: #0a00ff !important;
      }
    }
  }

  .el-message-box__btns {
    height: 80px;
    background-color: #465979;
    text-align: center;
    .el-button {
      height: 45px;
      width: 160px;
      font-size: 20px;
    }

    .messageCancelBtn {
      color: #3395f0;
      background-color: #465979;
      border: 1px solid #3395f0;
    }

    .messageConfirmBtn {
      color: #fff;
      background-color: #f58194 !important;
      border: #f58194;
    }

  }
}
</style>