11

src/views/index.vue

@@ -92,7 +92,12 @@
                   </el-col>
                 </el-col>
                 <el-col :span="24" class="list">
-                  <span class="img">
+                  <span class="img" v-for="(item, index) in imgs" :key="index">
+                    <el-link :href="item.href1" :underline="false">
+                      <el-image :src="item.url" style="width: 170px;height: 53px;"></el-image>
+                    </el-link>
+                  </span>
+                  <!-- <span class="img">
                     <img src="../assets/service1.jpg" style="width: 170px;height: 53px;" />
                   </span>
                   <span class="img">
@@ -115,7 +120,7 @@
                   </span>
                   <span class="img">
                     <img src="../assets/service1.jpg" style="width: 170px;height: 53px;" />
-                  </span>
+                  </span> -->
                 </el-col>
               </el-col>
             </el-col>
@@ -124,10 +129,16 @@
         <el-col :span="24" class="link">
           <div class="w_1200">
             <el-col :span="24" class="one">
-              <span>友情链接</span>
-              <a :href="item.href1" v-for="(item, index) in links" :key="index">
-                <el-image :src="item.url" class="img"></el-image>
-              </a>
+              <el-col :span="3" class="link">
+                友情链接
+              </el-col>
+              <el-col :span="21" class="linkImg">
+                <el-col :span="6" v-for="(item, index) in links" :key="index" class="links">
+                  <el-link :href="item.href1" :underline="false">
+                    <el-image :src="item.url"></el-image>
+                  </el-link>
+                </el-col>
+              </el-col>
             </el-col>
           </div>
         </el-col>
@@ -163,6 +174,16 @@ export default {
         { text: '2019年中国科学院、中国工程院新增两名吉林省院士', time: '2019-12-05' },
         { text: '2019年中国科学院、中国工程院新增两名吉林省院士', time: '2019-12-05' },
         { text: '2019年中国科学院、中国工程院新增两名吉林省院士', time: '2019-12-05' },
+        { text: '2019年中国科学院、中国工程院新增两名吉林省院士中国工程院新增两名吉林省院士中国工程院新增两名吉林省院士', time: '2019-12-05' },
+        { text: '2019年中国科学院、中国工程院新增两名吉林省院士', time: '2019-12-05' },
+        { text: '2019年中国科学院、中国工程院新增两名吉林省院士', time: '2019-12-05' },
+        { text: '2019年中国科学院、中国工程院新增两名吉林省院士', time: '2019-12-05' },
+        { text: '2019年中国科学院、中国工程院新增两名吉林省院士', time: '2019-12-05' },
+        { text: '2019年中国科学院、中国工程院新增两名吉林省院士中国工程院新增两名吉林省院士中国工程院新增两名吉林省院士', time: '2019-12-05' },
+        { text: '2019年中国科学院、中国工程院新增两名吉林省院士', time: '2019-12-05' },
+        { text: '2019年中国科学院、中国工程院新增两名吉林省院士', time: '2019-12-05' },
+        { text: '2019年中国科学院、中国工程院新增两名吉林省院士', time: '2019-12-05' },
+        { text: '2019年中国科学院、中国工程院新增两名吉林省院士', time: '2019-12-05' },
       ],
       tzgg: [
         { text: '2019年中国科学院、中国工程院新增两名吉林省院士中国工程院新增两名吉林省院士中国工程院新增两名吉林省院士', time: '12-05' },
@@ -189,6 +210,40 @@ export default {
           href1: '',
         },
       ],
+      imgs: [
+        {
+          url: require('../assets/service1.jpg'),
+          href1: '',
+        },
+        {
+          url: require('../assets/service2.jpg'),
+          href1: '',
+        },
+        {
+          url: require('../assets/service3.jpg'),
+          href1: '',
+        },
+        {
+          url: require('../assets/service4.jpg'),
+          href1: '',
+        },
+        {
+          url: require('../assets/service5.jpg'),
+          href1: '',
+        },
+        {
+          url: require('../assets/service6.jpg'),
+          href1: '',
+        },
+        {
+          url: require('../assets/service7.jpg'),
+          href1: '',
+        },
+        {
+          url: require('../assets/service8.jpg'),
+          href1: '',
+        },
+      ],
     };
   },
   created() {},
@@ -272,20 +327,21 @@ export default {
   .one {
     height: 100px;
     background-color: #fff;
-    padding-top: 25px;
-    span {
+    .link {
       font-size: 22px;
       font-weight: bold;
       color: #2c3250;
-      display: inline-block;
-      width: 130px;
+      height: 100px;
+      line-height: 100px;
       text-align: center;
-      a {
-        display: inline-block;
-        img {
-          vertical-align: middle;
-          border: 0;
-          margin: 0px 10px;
+    }
+    .linkImg {
+      padding: 25px 0px;
+      .links {
+        text-align: center;
+        .el-image {
+          width: 245px;
+          height: 50px;
         }
       }
     }