vue.js

关注公众号 jb51net

关闭
首页 > 网络编程 > JavaScript > javascript类库 > vue.js > ElementUI修改Dialog的标题样式

ElementUI如何修改Dialog的标题样式

作者:呈两面包夹芝士

这篇文章主要介绍了ElementUI如何修改Dialog的标题样式问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教

问题描述

修改Dialog弹出框标题样式,要求车牌号为蓝色

后面的文本为默认样式效果如图

原因分析

通过看源码发现<el-dialog>的title实际上是一个<slot>插槽

只需要在插槽里布好局就可以修改样式

解决方案

代码如下:

<el-dialog v-model="QRCodeVisible" center>
   <template #title>
      <div class='titleZise'><span class="QRTitle">{{QRCodeTitle}}</span>代驾险二维码</div>
    </template>
</el-dialog>

然后在CSS中设置相应的样式即可。

效果图:

总结

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。 

您可能感兴趣的文章:
阅读全文