微信起始页按钮背景

package.json

@@ -1,6 +1,6 @@
 {
   "name": "yuhuatai-mobile",
-  "version": "0.1.20221030.1830",
+  "version": "0.2.20221031.1830",
   "private": true,
   "scripts": {
     "serve": "vue-cli-service serve --mode dev",

src/views/HomeView.vue

@@ -14,7 +14,12 @@
         <button
           @click="onClickStart"
         >
-          开始体验
+          <img
+            src="@/assets/images/button-bg-blank.png"
+            alt=""
+            draggable="false"
+          >
+          <span>开始体验</span>
         </button>
       </div>
     </transition>
@@ -190,7 +195,6 @@ export default {
     background-color: #D8B275;
     background-image: url(@/assets/images/homepage-bg.jpg);
     background-size: cover;
-
     > .title {
       position: absolute;
       width: 39.63rem;
@@ -201,14 +205,26 @@ export default {
     > button {
       width: 21.67rem;
       height: 6.25rem;
-      background: red;
       color: #fff;
       font-size: 1.83rem;
       font-weight: bold;
       position: absolute;
+      z-index: 0;
       left: 50%;
       bottom: 8.08rem;
       transform: translate(-50%);
+      > img {
+        position: absolute;
+        top: 0;
+        left: 0;
+        height: 100%;
+        width: 100%;
+        z-index: -1;
+      }
+      > span {
+        font-size: 1.83rem;
+        font-weight: bold;
+      }
     }
   }