📦 按要求修改首页外链图片

src/assets/scss/main.scss

@@ -314,6 +314,7 @@ nav.main-nav {
   background-color: var(--color-box);
   border-radius: 10px;
   padding: 26px;
+  overflow: hidden;
 
   &.fill {
     height: 100%;

src/pages/index.vue

@@ -114,44 +114,56 @@
         <div class="row">
           <div class="col col-12">
             
-            <Carousel v-bind="carouselConfig2">
-              <Slide>
-                <div class="d-flex flex-row w-100">
-                  <a href="http://www.12371.cn/special/xxzd/" target="_blank" class="w-25">
-                    <img src="@/assets/images/bars/sixiang.png" class="mt-3 bars-image" /> 
-                  </a>
-                  <a href="http://cpc.people.com.cn/GB/67481/448544/index.html" target="_blank" class="w-25">
-                    <img src="https://wlj.xm.gov.cn/ztzl/202211/W020221213510920336898.jpg" class="mt-3 bars-image" /> 
-                  </a>
-                  <a href="http://wlj.xm.gov.cn/ztzl/dsxxjy/" target="_blank" class="w-25">
-                    <img src="@/assets/images/bars/dangshi.png" class="mt-3 bars-image" /> 
-                  </a>
-                  <a href="http://wlj.xm.gov.cn/ztzl/ggcx/" target="_blank" class="w-25">
-                    <img src="@/assets/images/bars/zhengyou.jpg" class="mt-3 bars-image" /> 
-                  </a>
-                </div>
+            <Carousel v-bind="carouselConfig2" class="main-box p-0">
+              <Slide class="d-flex flex-row w-100">
+                <a href="http://www.12371.cn/special/xxzd/" target="_blank">
+                  <img src="@/assets/images/bars/宣传习近平.jpg" class="mt-3 bars-image" /> 
+                </a>
               </Slide>
-              <Slide>
-                <div class="d-flex flex-row w-100">
-                  <a href="http://wlj.xm.gov.cn/ztzl/ggcx/" target="_blank" class="w-25">
-                    <img src="@/assets/images/bars/chuangxin.png" class="mt-3 bars-image" /> 
-                  </a>
-                  <a href="https://liuyan.www.gov.cn/2021wxzlsjh/bmdf.html?q=fj" target="_blank" class="w-25">
-                    <img src="@/assets/images/bars/gwy.jpg" class="mt-3 bars-image" /> 
-                  </a>
-                  <a href="https://wlj.xm.gov.cn/ztzl/202003/t20200326_2434593.htm" target="_blank" class="w-25">
-                    <img src="@/assets/images/bars/xmlvyou.jpg" class="mt-3 bars-image" /> 
-                  </a>
-                  <a href="http://xm.zwfw.fujian.gov.cn/person-todo/detail?userType=3&curStatus=dept&deptId=A8E0954E119F2E6342C87F48AC54EE31&bsfwCount=93&xzjgCount=609" target="_blank" class="w-25">
-                    <img src="@/assets/images/bars/wangshuanbanshi.png" class="mt-3 bars-image" /> 
-                  </a>
-                </div>
+              <Slide class="d-flex flex-row w-100">
+                <a href="http://cpc.people.com.cn/GB/67481/448544/index.html" target="_blank">
+                  <img src="@/assets/images/bars/二十大.jpg" class="mt-3 bars-image" /> 
+                </a>
+              </Slide>
+              <Slide class="d-flex flex-row w-100">
+                <a href="http://wlj.xm.gov.cn/ztzl/dsxxjy/" target="_blank">
+                  <img src="@/assets/images/bars/党史.jpg" class="mt-3 bars-image" /> 
+                </a>
+              </Slide>
+              <Slide class="d-flex flex-row w-100">
+                <a href="http://wlj.xm.gov.cn/ztzl/ggcx/" target="_blank">
+                  <img src="@/assets/images/bars/争优.jpg" class="mt-3 bars-image" /> 
+                </a>
+              </Slide>
+              <Slide class="d-flex flex-row w-100">
+                <a href="http://wlj.xm.gov.cn/ztzl/ggcx/" target="_blank">
+                  <img src="@/assets/images/bars/改革创新.jpg" class="mt-3 bars-image" /> 
+                </a>
+              </Slide>
+              <Slide class="d-flex flex-row w-100">
+                <a href="https://liuyan.www.gov.cn/2021wxzlsjh/bmdf.html?q=fj" target="_blank">
+                  <img src="@/assets/images/bars/国务院.jpg" class="mt-3 bars-image" /> 
+                </a>
+              </Slide>
+              <Slide class="d-flex flex-row w-100">
+                <a href="https://wlj.xm.gov.cn/ztzl/202003/t20200326_2434593.htm" target="_blank">
+                  <img src="@/assets/images/bars/厦门旅游服务.jpg" class="mt-3 bars-image" /> 
+                </a>  
+              </Slide>
+              <Slide class="d-flex flex-row w-100">
+                <a href="http://xm.zwfw.fujian.gov.cn/person-todo/detail?userType=3&curStatus=dept&deptId=A8E0954E119F2E6342C87F48AC54EE31&bsfwCount=93&xzjgCount=609" target="_blank">
+                  <img src="@/assets/images/bars/网上办事大厅.jpg" class="mt-3 bars-image" /> 
+                </a>
               </Slide>
               <template #addons>
                 <Navigation />
                 <Pagination />
               </template>
             </Carousel>
+
+            <h2 class="text-center banner-title">
+              保护利用，传承发展
+            </h2>
           </div>
         </div>
 
@@ -431,10 +443,19 @@ onMounted(() => {
 @use "sass:list";
 @use "sass:math";
 
+.banner-title {
+  font-family: "STSongtiSC", "Microsoft YaHei", sans-serif;
+  font-size: 36px;
+  font-weight: bold;
+  letter-spacing: 10px;
+  color: var(--color-primary);
+  margin-top: 35px;
+  margin-bottom: 20px;
+}
 .bars-image {
   width: 100%;
   height: 130px;
-  object-fit: cover;
+  object-fit: contain;
 }
 .qr-modal-content {
   text-align: center;