update

src/assets/css/index.css

@@ -13,10 +13,14 @@ i {
     color: #077AEC;
     color: #077AEC;
 }
 }
 
 
-.container {
-    padding-top: 46px;
+@supports(top:constant(safe-area-inset-top)) {
+    .container {
+        padding-top: calc(46px+constant(safe-area-inset-top));
+    }
 }
 }
 
 
+
+
 .mt0 {
 .mt0 {
     margin-top: 0 !important;
     margin-top: 0 !important;
 }
 }
\ No newline at end of file

src/components/TabHeader.vue

 <template>
 <template>
-  <div id="showheader" class="header-warp">
+  <div id="showheader" class="header-warp iosStyle">
     <van-nav-bar id="nav" :title="title" left-text left-arrow>
     <van-nav-bar id="nav" :title="title" left-text left-arrow>
       <template #title>
       <template #title>
         <a class="header-title title-one" :class="isActive?'title-active':''" href="/">人事服务</a>
         <a class="header-title title-one" :class="isActive?'title-active':''" href="/">人事服务</a>
@@ -39,9 +39,12 @@ export default {
 </script>
 </script>
 
 
 <style scoped>
 <style scoped>
-.iosStyle {
-  padding-top: 64px;
+@supports (top: constant(safe-area-inset-top)) {
+  .iosStyle {
+    padding-top: constant(safe-area-inset-top);
+  }
 }
 }
+
 .header-warp {
 .header-warp {
   position: fixed;
   position: fixed;
   top: 0;
   top: 0;