chore:marywood营销页面添加按钮

components/marywood/MaryBanner.vue

 <template>
-  <div class="main_content">
+  <div class="main_content ">
+    <div class="container_item banner1">
       <a href="https://marywood-plus.ezijing.com" target="_blank">
-      <img src="https://webapp-pub.ezijing.com/www/h5/marywood/mary_banner1.png" alt="" />
+        <div class="btn_detail">查看详情</div>
       </a>
+    </div>
+
+    <div class="container_item banner2">
       <a href="https://marywood.ezijing.com" target="_blank">
-      <img src="https://webapp-pub.ezijing.com/www/h5/marywood/mary_banner2.png" alt=""/>
+        <div class="btn_detail">查看详情</div>
       </a>
     </div>
+  </div>
 </template>
-  <script>
-    export default {}
-  </script>
+<script>
+export default {}
+</script>
 
-  <style scoped>
-  .main_content{
+<style lang="scss" scoped>
+.main_content {
   display: flex;
   justify-content: center;
   align-items: center;
   flex-direction: column;
-  }
-  img{
+
+  .container_item {
     width: 2.75rem;
     height: 2.75rem;
-    margin-top: .37rem;
-
-  }</style>
-</template>
+    margin-top: 0.42rem;
+    position: relative;
+    .btn_detail {
+      width: 0.87rem;
+      height: 0.25rem;
+      border: 1px solid #ffffff;
+      line-height: 0.25rem;
+      text-align: center;
+      font-size: 0.15rem;
+      font-weight: 500;
+      color: #ffffff;
+      position: absolute;
+      top: 2.15rem;
+      left: 50%;
+      transform: translateX(-50%);
+      cursor: pointer;
+    }
+    // .btn_detail:hover {
+    //   background: #ffffff;
+    //   color: #333333;
+    // }
+  }
+  .banner1 {
+    background: url(https://webapp-pub.ezijing.com/www/h5/marywood/mary_banner1.png) no-repeat;
+    background-size: 100% 100%;
+  }
+  .banner2 {
+    background: url(https://webapp-pub.ezijing.com/www/h5/marywood/mary_banner2.png);
+    background-size: contain;
+  }
+}
+</style>