首页 > 其他 > 详细

关于element的form的label的文字两端对齐.

时间:2019-03-11 19:43:56      阅读:3382      评论:0      收藏:0      [点我收藏+]

在使用elementUI的form的时候,label只有左右,居中对齐.但是为了准确无误的完成UI给的高保真,(本人也觉得当时两端对齐好看一点).所以就去找了一下,居然都没这个话题......(可能是问题太简单了.),我就自己修改了一下代码,下面放出来,自己记忆,和供有用的人参考一下.

下面是修改了样式之前的样子

技术分享图片

代码:

 .info-form>>>.el-form-item label:after {
        content: " ";
        display: inline-block;
        width: 100%;
    }

    .info-form>>>.el-form-item__label {
        text-align: justify
    }
    /* 这里去除必选字段的*,这个符号会造成一定影响,去掉之后我用了li列表进行定位,在前面加上" * ". */
    .info-form>>>.el-form-item.is-required .el-form-item__label:before {
        content: none !important;
    }

####注:info-form是我这个form表单的上级元素.(为了不影响全局的样式,) ">>>",这个是深度选择器,可以在style 为scoped的时候找到你的dom进行修改.

下面是效果图

技术分享图片

别喷我!

关于element的form的label的文字两端对齐.

原文:https://www.cnblogs.com/niluiquhz/p/10512492.html

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