在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問(wèn)答/HTML/ elment ui el-col不自適應(yīng)

elment ui el-col不自適應(yīng)

使用element-ui的el-row el-col做布局,結(jié)果頁(yè)面不自適應(yīng)

clipboard.png

代碼如下:
<template>
<el-main class="payList">

<el-row>
  <el-col :span="16">
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <span>發(fā)票</span>
      </div>
      <div class="text item" style="text-align: center;">
        <img :src="temp.imgName" style="width: 70%;height: 70%;"/>
      </div>
    </el-card>
  </el-col>

  <el-col :span="8">
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <span>審核</span>
      </div>
      <div class="text item">
        <el-form :rules="rules" ref="dataForm" :model="temp" label-position="right" label-width="160px" style=''>
          <el-form-item :label="$t('用戶')" prop="">
            <el-input style="width: 260px" v-model="temp.realName" disabled="disabled"></el-input>
          </el-form-item>
          <el-form-item :label="$t('類型')" prop="">
            <el-select clearable class="filter-item" style="width: 130px" v-model="temp.type"
                       :placeholder="$t('類型')">
              <el-option v-for="item in  typeList" :key="item.key" :label="item.display_name"
                         :value="item.key"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item :label="$t('發(fā)票說(shuō)明')" prop="">
            <el-input style="width: 260px" type="textarea" :autosize="{ minRows: 2, maxRows: 4}"
                      v-model="temp.comments"></el-input>
          </el-form-item>
          <el-form-item :label="$t('交易方向')" prop="">
            <el-select clearable class="filter-item" style="width: 130px" v-model="temp.direction"
                       :placeholder="$t('交易方向')">
              <el-option v-for="item in  directionList" :key="item.key" :label="item.display_name"
                         :value="item.key"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item :label="$t('交易方用戶ID')" prop="">
            <el-input style="width: 260px" v-model="temp.peerUserId"></el-input>
          </el-form-item>
          <el-form-item :label="$t('交易方名稱')" prop="">
            <el-input style="width: 260px" v-model="temp.peerUserName"></el-input>
          </el-form-item>
          <el-form-item :label="$t('交易方納稅人識(shí)別號(hào)')" prop="">
            <el-input style="width: 260px" v-model="temp.peerTaxId"></el-input>
          </el-form-item>
          <el-form-item :label="$t('交易金額')" prop="">
            <el-input style="width: 260px" v-model="temp.amount"></el-input>
          </el-form-item>
          <el-form-item :label="$t('幣種')" prop="result">
            <el-select clearable class="filter-item" style="width: 130px" v-model="temp.currencyType"
                       :placeholder="$t('幣種')">
              <el-option v-for="item in  currencyTypeList" :key="item.key" :label="item.display_name"
                         :value="item.key"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item :label="$t('人民幣總額')" prop="">
            <el-input style="width: 260px" v-model="temp.rmbAmount"></el-input>
          </el-form-item>
          <el-form-item :label="$t('開(kāi)票日期')" prop="">
            <el-date-picker v-model="temp.issueDateStr" type="date"
                            placeholder="請(qǐng)選擇開(kāi)票日期"
                            format="yyyy-MM-dd"
                            value-format="yyyy-MM-dd"
                            class="formInput"
            >
            </el-date-picker>
          </el-form-item>
          <el-form-item :label="$t('發(fā)票號(hào)')" prop="">
            <el-input style="width: 260px" v-model="temp.receiptId"></el-input>
          </el-form-item>
          <el-form-item :label="$t('FCI總數(shù)')" prop="">
            <el-input style="width: 260px" v-model="temp.fciAmount"></el-input>
          </el-form-item>
          <el-form-item :label="$t('結(jié)果')" prop="result">
            <el-select clearable class="filter-item" style="width: 130px" v-model="temp.result"
                       :placeholder="$t('審核結(jié)果')">
              <el-option v-for="item in  resultList" :key="item.key" :label="item.display_name"
                         :value="item.key"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item :label="$t('說(shuō)明')" prop="">
            <el-input style="width: 260px" type="textarea" :autosize="{ minRows: 2, maxRows: 4}"
                      v-model="temp.auditResult" :placeholder="$t('請(qǐng)?zhí)顚?xiě)說(shuō)明')"></el-input>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer" style="text-align: center;">
          <el-button type="primary" @click="saveAudit" >{{$t('保存')}}</el-button>
        </div>
      </div>
    </el-card>


  </el-col>
</el-row>

</el-main>
</template>

你期待的結(jié)果是什么?實(shí)際看到的錯(cuò)誤信息又是什么?

我希望大屏幕和小屏幕都顯示一樣,目前小屏幕的時(shí)候,頁(yè)面顯示不全
大屏幕:
圖片描述
小屏幕:
圖片描述

回答
編輯回答
黑與白

ElementUI 響應(yīng)式樣式需要另外引入 一個(gè) CSS 文件, 此后你寫(xiě)的 :span="12" :md="10"才有效

import "@/assets/css/element-display.css";
2017年8月10日 18:20
編輯回答
小曖昧

你里邊元素限制的固定寬度

2017年12月24日 20:41