'init2'

src/views/EbookDetail.vue

@@ -6,7 +6,9 @@
     </div>
     <template v-else-if="ebook">
       <div class="coverWrap">
-        <div class="cover" :style="{ backgroundImage: `url(${ebook.cover})` }" />
+        <div class="cover">
+          <img v-if="ebook.cover" :src="ebook.cover" alt="" class="cover__img" />
+        </div>
         <p class="desc">{{ ebook.description }}</p>
       </div>
       <div class="chapterList">
@@ -143,13 +145,22 @@ onMounted(async () => {
     aspect-ratio: 3 / 4;
     margin: 0 auto 16px;
     border-radius: var(--radius-md);
-    background-size: cover;
-    background-position: center;
+    background-color: var(--color-bg-muted);
     box-shadow: var(--shadow-md);
+    position: relative;
+    overflow: hidden;
 
     @media (min-width: 768px) {
       max-width: 240px;
     }
+
+    &__img {
+      width: 100%;
+      height: 100%;
+      object-fit: cover;
+      display: block;
+      border-radius: inherit;
+    }
   }
 
   .desc {