kun 19/9/26 9:28

src/components/FooterNav.vue

@@ -1,5 +1,6 @@
 <template>
-  <div id="wrapper-w" :style="{'background-image':'url('+imgUrl.foot+')'}">
+  <div id="wrapper-w"
+       :style="{'background-image':'url('+imgUrl.foot+')'}">
     <div>
       <p>版权所有：朝阳区委社会工委区民政局</p>
       <p>京ICP备19040879号 Copyright 2019-2029 www.cyteam.orz.cn All Rights Reserved</p>
@@ -28,7 +29,8 @@ export default {
 
 <style lang='scss' scoped>
 #wrapper-w {
-  width: 1280px;
+  // width: 1280px;
+  width: 100%;
   height: 227px !important;
   background-size: 100% 100%;
   background-color: rgba($color: #000000, $alpha: 0.6);

src/components/HeaderNav.vue

@@ -1,5 +1,9 @@
 <template>
-  <div id="wrapper" :style="{'background-image':'url('+imgUrl.home+')'}">
+  <div id="wrapper">
+    <!--  :style="{'background-image':'url('+imgUrl.home1+')'}"  -->
+    <div class="img-box">
+      <img :src="imgUrl.home1" alt />
+    </div>
     <div class="box">
       <div @click="$jump('homePage')" :class="styleNum == 0 ? 'style': ''">党组织建设</div>
       <div
@@ -22,7 +26,10 @@ export default {
   props: ['index_num'],
   data () {
     return {
-      imgUrl: { home: require('../../static/img/home.png') },
+      imgUrl: {
+        home: require('../../static/img/home.png'),
+        home1: require('../../static/img/home1.png')
+      },
       styleNum: 0
     }
   },
@@ -34,27 +41,43 @@ export default {
     sub = this.$props.index_num
     this.styleNum = sub
   },
-  mounted () {}
+  mounted () { }
 }
 </script>
 
 <style lang='scss' scoped>
 #wrapper {
-  width: 1280px;
+  min-width: 1280px;
+  // width: 100%;
   height: 389px;
   box-sizing: border-box;
+  background-repeat: no-repeat;
   background-size: 100% 100%;
   position: relative;
+  overflow: hidden;
+
+  .img-box {
+    width: 100%;
+    height: 389px;
+    display: flex;
+    justify-content: center;
+
+    img{
+      // width: 100%;
+      height:100%;
+    }
+  }
 
   .box {
     position: absolute;
     bottom: 0%;
     left: 0%;
-    width: 1280px;
+    // width: 1280px;
+    width: 100%;
     height: 63px;
     background-color: rgba($color: #fff, $alpha: 0.5);
     display: flex;
-    justify-content: space-evenly;
+    justify-content: space-around;
     align-items: center;
 
     & > div {