.el-form--inline.cip-form{ //width: 100%; display: flex; flex-wrap: wrap; } .cip-form--grid{ display: grid !important; grid-column-gap: 12px; } .cip-form--border{ grid-gap: 0; position: relative; @border-color: var(--el-border-color-lighter); .cip-form-item{ width: 100%; margin-top: -1px; border: 1px solid @border-color; .el-form-item{ margin-bottom: 0; } .el-form-item__label{ background: #FAFAFA; padding: 8px; border-right: 1px solid @border-color; font-weight: 500; text-align: left; justify-content: flex-start; // el-form-item__label默认开启flex导致text-align无效 height: 100%; } .el-form-item__content{ padding: 8px; .cip-form-item__input{ word-break: break-all; } } } } // only模式下去除form-item的margin-bottom .cip-form--readonly{ .cip-form-item{ .el-form-item{ margin-bottom: unset; } } } .cip-form.cip-form--mobile{ border-radius: 12px; background: #fff; padding: 12px; box-sizing: border-box; .cip-form-item { padding: 10px 0; box-sizing: border-box; .van-cell{ padding: 0; --van-cell-line-height: @formItemLineHeight; &:after{ border: none; } } &+.cip-form-item{ border-top: 1px solid #ddd; } .el-form-item{ margin-bottom: 0; } } }