样式

src/views/contactusview/contactusphone.vue

 <template>
-    <div style="padding-top: 0.7rem;background: #ffffff;">
-        <div style="text-align: center;width: 85%;margin: 0 auto">
-            <span style="font-size: 0.38rem;font-weight: bold;color: #3F3F53">{{$t("bottomNav.contactUs")}}</span>
-            <div style="width: 0.8rem;height: 0.07rem;background: #5D78FF;border-radius: 3px;margin: 0.2rem auto 0;"></div>
+    <div class="overfolowWrapper">
+        <div class="contentContact">
+            <p style="font-size: 0.38rem;font-weight: 500;color: #3F3F53;text-align: center;width: 100%;">{{$t("bottomNav.contactUs")}}</p>
+            <div style="width: 0.8rem;height: 0.07rem;background: #5D78FF;border-radius: 3px;margin: 0.2rem auto 0;margin-bottom: .8rem;"></div>
             <div class="divtext">
-                <span class="iconfont icon-envelope iconfontem"></span>
-                <p><span style="font-weight: bold">{{$t('Otherjson.mailbox')}}：</span>tb@techcode.com</p>
+                <p><span style="font-weight: 500">{{$t('Otherjson.mailbox')}}：</span>tb@techcode.com</p>
             </div>
             <div class="divtext">
-                <span class="iconfont icon-wechat"></span>
-                <p><span style="font-weight: bold">{{$t('bottomNav.kfWechat')}}：</span>techbookservice</p>
-                <p style="margin-top: 0.3rem"><span style="font-weight: bold;">{{$t('projectdynamics.contactnumber')}}：</span>0316-6175185</p>
+                <p><span style="font-weight: 500">{{$t('bottomNav.kfWechat')}}：</span>techbookservice</p>
             </div>
             <div class="divtext">
-                <span class="iconfont icon-dingwei"></span>
-                <p><span style="font-weight: bold">{{$t('Otherjson.hbAddress')}}</span>{{$t('Otherjson.hbAddressText')}}</p>
-                <p><span style="font-weight: bold">{{$t('Otherjson.bjAddress')}}</span>{{$t('Otherjson.addresstext')}}</p>
+                <p><span style="font-weight: 500;">{{$t('projectdynamics.contactnumber')}}：</span>0316-6175185</p>
             </div>
-        </div>
-        <div>
-            <!--<img src="../../assets/img/index/Group 5@2x.png" style="width: 7.5rem;">-->
+            <div class="divtext">
+                <p><span style="font-weight: 500">{{$t('Otherjson.hbAddress')}}</span>{{$t('Otherjson.hbAddressText')}}</p>
+            </div>
+            <div class="divtext">
+                <p><span style="font-weight: 500">{{$t('Otherjson.bjAddress')}}</span>{{$t('Otherjson.addresstext')}}</p>
+            </div>
+
+
         </div>
     </div>
 </template>
@@ -31,8 +31,12 @@
 </script>
 
 <style scoped lang="scss">
+    .contentContact{
+        width: 100%;
+        padding: 0 .6rem;
+    }
     .divtext{
-        margin: 0.7rem 0;
+        margin: 0.2rem 0;
         >span{
             border:2px solid #5D78FF;
             font-size: 0.5rem;
@@ -48,5 +52,13 @@
             font-size: 0.32rem;
         }
     }
+    .overfolowWrapper{
+        padding-top: 0.7rem;
+        background: #ffffff;
+        height: 100%;
+        position: relative;
+        width: 100%;
+        padding-bottom: 3rem;
+    }
 
 </style>
\ No newline at end of file