el-form对齐方式
position标签属性在el-form 中，你可以通过label-position 和label-width 属性来调整表单项的对齐方式。label-position 属性可以设置为"left"、"right" 或"top"，这决定了标签的显示位置。label-width 属性则用于设置标签的宽度。
如果你想要让表单项在同一行显示，可以在el-form-item 上添加inline="true" 属性。
以下是一个示例代码，演示了如何设置el-form 的对齐方式：```html
<el-form :label-position="labelPosition"
ref="editForm" :model="editForm"
label-width="146px" :rules="rules" :hide-required-asterisk="false"> <el-row :gutter="20">
<el-col :span="8">
<el-form-item prop="devName">
<span slot="label" class="slot_form_label">设备名称
</span>
<el-input v-model="editForm.devName" placeholder="请输入设备名称" clearable></el-input>
</el-form-item>
<el-form-item inline="true" prop="deviceType">
<span slot="label" class="slot_form_label">设备类型
</span>
<el-select v-model="editForm.deviceType" placeholder="请选择设备类型" clearable>
<el-option v-for="item in
deviceOption" :key="item.value" :label="item.label" :value="item.value" ></el-option>
</el-select>
</el-form-item>
<el-form-item prop="ip">
<span slot="label" class="slot_form_label">IP地址
</span>
<el-input v-model="editForm.ip" placeholder="请输入IP 地址" clearable></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
```
在上述示例中，你可以看到通过设置labelPosition 和labelWidth 属性，你可以调整表单项的对齐方式。同时，通过添加inline="true" 属性，你可以将设备类型和IP 地址的表单项显示在同一行。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。