vue:如何设置el-form-item的label间距
时间: 2023-12-14 08:36:51 浏览: 231
Vue中el-form标签中的自定义el-select下拉框标签功能
你可以使用 `label-width` 属性来设置 `el-form-item` 的 label 与控件之间的间距。这个属性可以接受一个字符串作为值,用于设置 label 的宽度。
例如,你可以在 `el-form` 组件上添加 `label-width` 属性来设置所有 `el-form-item` 的 label 宽度:
```html
<el-form :label-width=" '100px' ">
<el-form-item label="Label 1">
<!-- 控件1 -->
</el-form-item>
<el-form-item label="Label 2">
<!-- 控件2 -->
</el-form-item>
</el-form>
```
你也可以单独为每个 `el-form-item` 设置不同的 label 宽度,只需要在对应的 `el-form-item` 上添加 `label-width` 属性:
```html
<el-form>
<el-form-item label="Label 1" :label-width=" '100px' ">
<!-- 控件1 -->
</el-form-item>
<el-form-item label="Label 2" :label-width=" '120px' ">
<!-- 控件2 -->
</el-form-item>
</el-form>
```
通过调整 `label-width` 的值,你可以自定义 label 与控件之间的间距。
阅读全文