修改el-form表單的el-form-item的label的字體大小以及修改el-row中的el-col的高度


1、修改el-form表單的el-form-item的label的字體大小

首先在el-form屬性加id

  <el-form
        ref="form"
        :rules="rules"
        size="mini"
        :model="form"
        label-width="135px"
        id="selectForm"
      >
size="mini"把表單內的插件大小都設置成mini大小
#selectForm >>> .el-form-item__label {
  font-size: 12px;
}

2、修改el-row中的el-col的高度

.el-row >>> .el-col {
  margin: 0px;
  padding: 0px;
  height: 30px;
}

如果不行的話在el-row標簽里面加類名

<el-row class="el-row1">
.el-row1 >>> .el-col {
  margin: 0px;
  padding: 0px;
  height: 30px;
}

金額范圍兩個el-input框

  <el-col :md="{span:7, offset:0}" :sm="24">
            <el-form-item label="金額范圍" required>
              <el-col :md="{span:10, offset:0}" :sm="12">
                <el-form-item label-width="0px" prop="jefw1">
                  <el-input
                    size="mini"
                    v-model="form.jefw1"
                    placeholder="請輸入金額"
                    validate-event
                    v-on:input="form.jefw1=form.jefw1.replace(/[^\d^.^-]/g,'')"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :md="{span:1, offset:0}" :sm="1" align="center">-</el-col>
              <el-col :md="{span:10, offset:0}" :sm="12">
                <el-form-item prop="jefw2" label-width="0px">
                  <el-input
                    size="mini"
                    v-model="form.jefw2"
                    placeholder="請輸入金額"
                    validate-event
                    v-on:input="form.jefw2=form.jefw2.replace(/[^\d^.^-]/g,'')"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-form-item>
          </el-col>

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM