问答

el 表单一行多列布局怎么布局

作者:admin 2021-05-08 我要评论

想要的效果 我 :inline="true" 之后直接变成 怎么把下面的直接设成独占一行 el-form ref="form" :model="form" label-width="80px" size="mini" :inline="true" ...

在说正事之前,我要推荐一个福利:你还在原价购买阿里云、腾讯云、华为云服务器吗?那太亏啦!来这里,新购、升级、续费都打折,能够为您省60%的钱呢!2核4G企业级云服务器低至69元/年,点击进去看看吧>>>)

想要的效果
image.png

:inline="true"之后直接变成
image.png

怎么把下面的直接设成独占一行

<el-form ref="form" :model="form" label-width="80px" size="mini" :inline="true">
     <el-form-item label="姓名">
        <el-input v-model="addAddForm.name"></el-input>
      </el-form-item>
        <el-form-item label="手机">
           <el-input v-model="addAddForm.phone"></el-input>
         </el-form-item>
         <el-form-item label="地址">
            <el-input style=”width:100px” v-model="addAddForm.add"></el-input>
          </el-form-item>
</el-form>
###

看到你自己写的width:100px了吗

###
<el-form ref="form" :model="form" label-width="80px" size="mini" :inline="true">
     <el-form-item label="姓名">
        <el-input v-model="addAddForm.name"></el-input>
      </el-form-item>
        <el-form-item label="手机">
           <el-input v-model="addAddForm.phone"></el-input>
         </el-form-item>
         **<div>**
         <el-form-item label="地址" style="width:100%">
            <el-input style=”width:calc(100% - 80px);” v-model="addAddForm.add"></el-input>
          </el-form-item>         
        ** </div>**

</el-form>

版权声明:本文转载自网络,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。本站转载出于传播更多优秀技术知识之目的,如有侵权请联系QQ/微信:153890879删除

相关文章
  • el 表单一行多列布局怎么布局

    el 表单一行多列布局怎么布局

  • shell 脚本删除30天前备份的文件

    shell 脚本删除30天前备份的文件

  • 将爬虫部署到云服务器后,如何监控爬虫

    将爬虫部署到云服务器后,如何监控爬虫

  • android 的xml模板标识android, app, t

    android 的xml模板标识android, app, t

腾讯云代理商
海外云服务器