扫码测试

src/page/sweepCode/sweepCode.vue

 <template>
   <div id="Sweepcode">
     <div class="header">
-      <h3>应聘登记表</h3>
+      <h3 style="margin-top:10px">应聘登记表</h3>
     </div>
     <div class="sweepcode_content">
       <Form :label-width="120" :model="formInline" :rules="ruleInline"  ref="formInline" class="fontsize" label-position=left style="margin-left:3%">
         <FormItem label="邀约人" prop="Inviter" style="margin-top:1rem;font-size:15px">
-          <Input placeholder="请输入" style="width:90%;" v-model="formInline.Inviter" @on-focus='a' size="large"/>
+          <Input placeholder="请输入" style="width:85%;" v-model="formInline.Inviter" @on-focus='a' size="large"/>
         </FormItem>
-        <FormItem label="邀约手机号" style="" >
-          <Input placeholder="请输入" style="width:90%;" v-model="formInline.InviterPhoneNumber" @on-focus='a' size="large"/>
+        <FormItem label="邀约人号码" style="" class="phone">
+          <Input placeholder="请输入" style="width:85%;" v-model="formInline.InviterPhoneNumber" @on-focus='a' size="large"/>
         </FormItem> 
         <FormItem label="面试时间" prop="time">
-          <Input placeholder="请输入" style="width:45%;" v-model="formInline.date"  :readonly="true" size="large" />
+          <Input placeholder="请输入" style="width:40%;" v-model="formInline.date"  :readonly="true" size="large" />
           <!-- <DatePicker type="date" placeholder="请选择日期" style="width: 120px;margin-left:20px" v-model="formInline.date"  @on-change="selectDate" :options="options3" ></DatePicker> -->
-          <TimePicker type="time" placeholder="请选择时间" style="width: 43%" v-model="formInline.time" format="HH:mm"  @on-change="selectTime" @on-focus="defaultRRRR" :editable="false" size="large"></TimePicker>
+          <TimePicker type="time" placeholder="请选择时间" style="width: 40%" v-model="formInline.time" format="HH:mm"  @on-change="selectTime" @on-focus="defaultRRRR" :editable="false" size="large"></TimePicker>
         </FormItem>
         <FormItem label="应聘职位"   prop="position">
-          <Input placeholder="请输入" style="width:90%;" v-model="formInline.position" @on-focus='a' size="large"/>
+          <Input placeholder="请输入" style="width:85%;" v-model="formInline.position" @on-focus='a' size="large"/>
         </FormItem>
         <FormItem label="应聘来源" prop="model1">
-          <Select v-model="formInline.model1" style="width:90%;" size="large">
+          <Select v-model="formInline.model1" style="width:85%;" size="large">
             <Option v-for="item in origen" :value="item.value" :key="item.value">{{ item.label}}</Option>
           </Select>
         </FormItem> 
         <FormItem label="姓名" prop="name">
-          <Input placeholder="请与简历保持一致" style="width:90%;" v-model="formInline.name" @on-focus='a' size="large"/>
+          <Input placeholder="请与简历保持一致" style="width:85%;" v-model="formInline.name" @on-focus='a' size="large"/>
         </FormItem>
         <FormItem label="手机号码"  prop="phoneNUmber">
-          <Input placeholder="请输入" style="width:90%;" v-model="formInline.phoneNUmber" @on-focus='a' size="large"/>
+          <Input placeholder="请输入" style="width:85%;" v-model="formInline.phoneNUmber" @on-focus='a' size="large"/>
         </FormItem>
         <FormItem label="是否携带简历"   prop="model2">
-          <Select v-model="formInline.model2" style="width:90%;" size="large">
+          <Select v-model="formInline.model2" style="width:85%;" size="large">
             <Option v-for="item in isGET" :value="item.value" :key="item.value">{{ item.label }}</Option>
           </Select>
         </FormItem>     
       </Form>
     </div>
     <div class="submission">
-      <Button type='primary' @click="confirmSubmission" class="utbuton" >提交</Button>
+      <Button type='primary' @click="confirmSubmission" >提交</Button>
     </div>
     <Modal
       v-model="modal3"
@@ -252,22 +252,28 @@ export default {
  #Sweepcode{
    height: 100%;
    width:100%;
+   overflow: hidden;
+ }
+ .mobile{
+   width: 100%;
+   height: 100%
  }
   .header{
     font-size: 19px;
     text-align: center;
     height: 8%;
+    /* float: left; */
   }
-  .utbuton{
-    margin-left: 31%;
-    width:45%;
-    height: 2.2rem;
-    font-size: 1.4rem;
-    line-height: 1.4rem;
+  .submission{
     height: 20%;
-    margin-top: 20%
   }
-  
+  .submission button{
+    width: 40%;
+    font-size: 14px;
+    margin-top: 40px;
+    margin-left: 30%
+
+  }
   .sweepcode_content{
     margin-top:0.2rem;
     font-size: 15px;
@@ -285,5 +291,22 @@ export default {
 }
 .fontsize .ivu-form-item-label{
     font-size: 15px
-  }
+}
+.fontsize{
+  height: 100%;
+  width: 100%;
+  /* border: 1px solid yellow */
+}
+.fontsize .ivu-form-item.ivu-form-item-required{
+  /* border:1px solid red; */
+  height:7.5%;
+}
+.fontsize .phone{
+  /* border:1px solid red; */
+  height:7%;
+}
+/* .fontsize .ivu-form-item.ivu-form-item-required{
+  border: 2px solid black;
+  height: 10%
+} */
 </style>
\ No newline at end of file