如何让el-item-form横着
时间: 2023-07-05 09:14:42 浏览: 1025
Vue中el-form标签中的自定义el-select下拉框标签功能
要让 `el-form-item` 横向排列,你可以使用 `el-row` 和 `el-col` 栅格布局来实现。示例代码如下:
```html
<el-form>
<el-row>
<el-col :span="8">
<el-form-item label="姓名">
<el-input></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="年龄">
<el-input></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="性别">
<el-radio-group>
<el-radio label="男"></el-radio>
<el-radio label="女"></el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
</el-form>
```
这样,三个 `el-form-item` 就会横向排列在一行中。你可以根据需要更改 `el-col` 的 `:span` 属性来调整每个表单项的宽度。
阅读全文