Element-Plus表单label实现两端对齐(左右对齐)

项目场景:

提示:这里简述项目相关背景:
在使用Element-Plus的form的时候,label只有左右,居中对齐,缺少两端对齐的选项
故研究一下如何实现,其他方法也试过,都没效果,我在别人的基础上又研究了一下


问题描述

要求是表单label实现两端对齐

默认这个样子

在这里插入图片描述

要求是表单label实现两端对齐,如下

在这里插入图片描述网上也是找了几种方法,发现在Element-Plus组件中不生效,自己有研究了一下


解决方案:

提示:这里填写该问题的具体解决方案:
display: inline-block这个我看别人都是加在伪类中,一开始我也是这么做的,发现没效果,所以又看了一下控制台,发现放在el-form-item__label才生效,可能是Element-Plus版本不同吧!

 /deep/ .el-form-item label:after {content: "";width: 100%;
}/deep/ .el-form-item__label {/* display: inline-block必须要有,不然布局出问题,之前我看别人都加在伪类中,我试了没效果 */display: inline-block;text-align: justify;text-align-last: justify;
}
/* 这里去除必选字段的*,这个符号会造成一定影响,去掉之后我用了li列表进行定位,在前面加上" * ". *//deep/ .el-form-item.is-required .el-form-item__label:before {content: none !important;
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/166820.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

halcon分割粘连字符

下面的算子都可以分割: 1.*(推荐使用这个)在垂直范围较小的位置水平划分区域 partition_dynamic(circleRegion,parRegion,76,50)2.*将一个区域划分为大小大致相等的矩形。(这个方法适合宽度相等,很规则的排列的字符串…

计算机基础知识48

web应用程序 # Django框架是一款专门用来开发web应用的框架 # Web应用程序是一种可以通过浏览器访问的应用程序, B/S架构 案例:淘宝网、京东网... # 应用程序有两种模式: C/S:客户端/服务器端程序,这类程序一般独立运行 B/S&#xff1…

Jenkins CICD过程常见异常

1 Status [126] Exception when publishing, exception message [Exec exit status not zero. Status [126] 1.1 报错日志 SSH: EXEC: STDOUT/STDERR from command [/app/***/publish.sh] ... bash: /app/***/publish.sh: Permission denied SSH: EXEC: completed after 200…

LinkedList的插入速度一定比ArrayList快吗?

目录 一、有一道经典的面试题,“ArrayList 和 LinkedList 的区别是什么?”1、小白答法:2、入门答法:3、系统回答 二、LinkedList的插入速度一定比ArrayList快吗?三、分析一下两种数据结构的add源码1、先分析熟悉的Arra…

ZZ308 物联网应用与服务赛题第F套

2023年全国职业院校技能大赛 中职组 物联网应用与服务 任 务 书 (F卷) 赛位号:______________ 竞赛须知 一、注意事项 1.检查硬件设备、电脑设备是否正常。检查竞赛所需的各项设备、软件和竞赛材料等; 2.竞赛任务中所使用…

基于SSM的社区生鲜电商平台

末尾获取源码 开发语言:Java Java开发工具:JDK1.8 后端框架:SSM 前端:Vue 数据库:MySQL5.7和Navicat管理工具结合 服务器:Tomcat8.5 开发软件:IDEA / Eclipse 是否Maven项目:是 目录…

Unity Mirror学习(一) SyncVars特性使用

官网中所说的网络对象,指的是挂了 NetworkIdentity组件的对象 官网中所说的玩家对象,指的是NetworkManager脚本上的PlayerPrefab预制体 这个概念对阅读官网文档很重要,我刚开始并不理解,走了歪路 SyncVars(同步变量&a…

ruoyi前后端分离版本开发框架解读---让你快速入门

后端结构 com.ruoyi ├── common // 工具类 │ └── annotation // 自定义注解 │ └── config // 全局配置 │ └── constant // 通用常量 │ └── core …

【Mysql】where 条件子句之逻辑运算符

逻辑运算符 and &&or ||not ! student表 一.查询分数在80 - 90之间 and写法 &&写法 区间(between ....and......) 二.查询分数不为88 !写法 not写法 三.查询分数大于88或者年龄小于22 满足其中一个条件即可 or写法 ||写法

Xilinx FPGA SPIx4 配置速度50M约束语句(Vivado开发环境)

qspi_50m.xdc文件: set_property BITSTREAM.GENERAL.COMPRESS TRUE [current_design] set_property BITSTREAM.CONFIG.SPI_BUSWIDTH 4 [current_design] set_property BITSTREAM.CONFIG.CONFIGRATE 50 [current_design] set_property CONFIG_VOLTAGE 3.3 [curren…

华为交换机端口 access、trunk和hybrid收发数据规则

文章目录 1. 三个端口类型处理数据帧的汇总表2. access 端口3. trunk端口4. Hybrid 端口(交换机的默认端口类型)5.常用命令 1. 三个端口类型处理数据帧的汇总表 端口类型收到不带VLAN标签的帧的处理规则收到带VLAN标签的帧的处理规则发送帧时的处理规则…

数据采集代码示例

首先,你需要安装一个 Lua 的爬虫库,例如 Luanode 或者 Lush: lua local ltn12 require("ltn12") local http require("") local response http.request{ host "", port , path "/", …