首页 > 其他 > 详细

elementui中el-alert实现换行的方法

时间:2020-09-23 09:13:10      阅读:646      评论:0      收藏:0      [点我收藏+]

很多时候需要用到el-alert来做用户提醒, 但是默认的它无法实现换行,后来发现它有个标题slot,使用后就能实现轻松换行了

<el-alert title="需要注意的事项" type="warning">
    <template slot=title>
        <div class="iconSize">需要注意的事项:</div>
        <div class="iconSize">1、登录后请及时检查对应的姓名和手机号是否正确</div>
        <div class="iconSize">2、卡片式每页显示一个问题,列表式一页显示全部的问题</div>
        <div class="iconSize">3、评测问卷提交保存后就无法再次做答了,请慎重对待每一个问题</div>
    </template>
</el-alert>

CSS的部分,主要是为了让字看上去大一些,上下间隔开一些,有兴趣的可以给第一行写个标题CSS,更美观。

 .iconSize{
        font-size: 16px;
        padding: 10px;
        font-weight: bold;
        
}

最后效果如下:

技术分享图片

 

elementui中el-alert实现换行的方法

原文:https://www.cnblogs.com/wjbych/p/13716178.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!