要将
el-form-item
label右对齐，有两种方法可以实现。
方法一：
使用以下CSS样式：
```css
.
el-form-item
label:after {
content: "";
display: inline-block;
width: 100%;
}
.
el-form-item__
label {
text-align: justify;
height: 50px;
}
.
el-form-item.is-required .
el-form-item__
label:before {
content: none !important;
}
```
这段代码将
label的展示名称左
右对齐，并且给
label添加了一个占位元素。
方法二：
在
el-form-item
标签内使用template，并在template中定义
label的样式：
```html
<template>
<
el-form-item prop="name">
<div slot="
label" style="margin-left:10px;">名称</div>
<
el-input v-mod
el="form.name" placeholder="请输入名称"></
el-input>
</
el-form-item>
</template>
```
这段代码会给
label添加一个带有左边距的div，并将名称显示为
label的内容。
以上是两种将
el-form-item
label右对齐的方法。你可以根据实际情况选择其中一种来实现。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* [vue的
el-form-item
标签的
label名称左
右对齐el-table-column标题加红](https://blog.csdn.net/weixin_43932097/article/details/109602348)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
- *2* *3* [
elment-plus 中 怎么让
el-form-item 的
label 左对齐](https://blog.csdn.net/weixin_45691703/article/details/130324348)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
977
