• class="elformitem__content" style="marginleft: 120px;"


    问题:el-form标签中,由于设置了label-width="120px",导致每一个el-form-item标签都增多了一个样式style="margin-left: 120px;"

    效果如下:

    部分原代码如下:

    <template>
      <el-dialog title="修改密码" :visible.sync="dialogFormVisible" width="800px">
        <el-form ref="form" :rules="rules" :model="edit" label-position="right" label-width="120px" class="aa">
          <el-form-item>
            <el-row>
              <el-col>
                <el-form-item label="用户名:" prop="username">
                  <el-input v-model.trim="username" name="username" type="text" auto-complete="on" placeholder="请输入用户名"
                            style="background:transparent; 500px;" disabled/>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click="dialogFormVisible = false">取消</el-button>
          <el-button type="primary" @click="update(edit)">确认</el-button>
        </div>
      </el-dialog>
    </template>

    浏览器中解析后如下所示:

    解决办法:

    给form 加class="aa"

    样式如下:

    <style scoped>
    .aa >>> .el-form-item__content {
       margin-left:0px !important;
    }
    </style>

    修改后效果如下所示:

  • 相关阅读:
    DNS 查询长度
    WebSocket
    Overview of cookie persistence
    Linux Cluster
    keepalived + nginx 主主模式
    MIME 类型
    IaaS,PaaS,SaaS 的区别
    Linux下"负载均衡+高可用"集群的考虑点 以及 高可用方案说明(Keepalive/Heartbeat)
    交换机链路聚合与Linux的bond模式对照
    DHCP 中继
  • 原文地址:https://www.cnblogs.com/zwh0910/p/16434764.html
Copyright © 2020-2023  润新知