在 <el-form-item> 標(biāo)簽中薪介，el-input 中的 label 標(biāo)簽和 input 輸入框有時(shí)不能在同一行顯示：
<el-form ref="form" :model="formData">
<el-form-item label="活動(dòng)名稱">
<el-input v-model="formData.name" />
</el-form-item>
</el-form>
以上的代碼顯示的效果如下：
image
我們期望的效果是 label 和輸入框的距離是在同一行顯示。我們只需要在 el-form, el-form-item 上添加 label-width 屬性即可越驻。
在 el-form 上添加 label-width 屬性
<el-form ref="form" :model="formData" label-width="80px">
<el-form-item label="活動(dòng)名稱">
<el-input v-model="formData.name" />
</el-form-item>
</el-form>
在 el-form-item 上添加 label-width 屬性
<el-form ref="form" :model="formData">
<el-form-item label="活動(dòng)名稱" label-width="80px">
<el-input v-model="formData.name" />
</el-form-item>
</el-form>
通過(guò)在 el-form-item 和 el-form 上添加 label-width 屬性汁政，解決了 label 標(biāo)簽和input輸入框不能一行顯示的問(wèn)題。
image
