gxwebsoft
be2888d428
- 调整 `.is-required .el-form-item__label` 采用 `align-items: normal` 实现星号首行对齐 - 覆盖 Element Plus 固定高度 `height: 32px` 为 `height: auto` 以支持内容自适应高度 - 保持 `align-self: center` 使单行 label 与输入框垂直居中，折行时星号贴首行 - 修改星号 `::before` 的高度为 `auto` 并继承行高，保证首行基线一致 - 修复多行 label 下星号因 flex 居中导致位置偏移的问题 - 兼容 label 多种位置（右、左、顶）及多行折行场景，影响 project-apply 等表单页
1.7 KiB
1.7 KiB
必填星号与 label 首行齐平（全局）
- 根因：
element-ui.scss中.el-form-item--label-right .el-form-item__label { align-items:center }使 inline-flex label 的星号::before（独立 flex 子项）在多行折行时被垂直居中。 - 修复：label 改
align-self:center（整体仍随行垂直居中）+align-items:flex-start（星号/文字首行齐平），覆盖 label-right/left/top 三种位置；旧 inline-block 注释已修正。 - 影响页面：project-apply 独立表单页等所有多行 label 场景（弹窗内
white-space:nowrap不受影响）。
必填星号首行对齐：改用 align-items: normal（stretch 方案）
- 最终写法（
src/styles/element-ui.scss）：.is-required .el-form-item__label { align-self:center; align-items:normal; }+::before { display:inline-block; height:auto; line-height:inherit; margin-right:4px }。 - 原理：stretch 让星号盒子在「换行时」被拉伸到 label 全高、内容从顶部排布 → 贴首行；单行时盒子=一行高，视觉不变（比 flex-start 更贴合「只换行才生效」）。
- 前提：::before 高度必须 auto 且继承行高；label 不能是 固定 height + 等高 line-height，否则退化成居中，需 JS 判行数加 class。
星号方案补丁（关键）
- EP 的
.el-form-item__label写死height:32px; line-height:32px（项目只覆盖了 line-height:14px），导致 stretch 方案文字顶到 32px 盒子顶部、单行不居中。 - 修复：
.is-required .el-form-item__label { height:auto; align-self:center; align-items:normal }——height:auto 收缩到内容高 + align-self:center 行内居中 + normal(stretch) 仅换行时星号贴首行。