element ui form 表单 label在上,input输入框在下
时间: 2023-08-03 22:44:14 浏览: 1750
vue用elementui写form表单时,在label里添加空格操作
要实现 Element UI 表单的 label 在上方,input 输入框在下方,可以使用以下步骤:
1. 在 el-form 上添加属性 label-position="top",这会让表单的 label 放在上面。
2. 在 el-form-item 上添加属性 label-width,设置 label 的宽度。
3. 在 el-input 上添加属性 size,这会让输入框的大小与 label 对齐。
示例代码如下:
```
<el-form label-position="top">
<el-form-item label="姓名" label-width="80px">
<el-input size="small"></el-input>
</el-form-item>
</el-form>
```
这样就可以实现 label 在上方,input 在下方的表单布局。
阅读全文