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>

GitHub 加速计划 / eleme / element
54.06 K
14.63 K
下载
A Vue.js 2.0 UI Toolkit for Web
最近提交(Master分支:3 个月前 )
c345bb45 7 个月前
a07f3a59 * Update transition.md * Update table.md * Update transition.md * Update table.md * Update transition.md * Update table.md * Update table.md * Update transition.md * Update popover.md 7 个月前
Logo

旨在为数千万中国开发者提供一个无缝且高效的云端环境,以支持学习、使用和贡献开源项目。

更多推荐