diff --git a/app/src/assets/scss/util/_responsive.scss b/app/src/assets/scss/util/_responsive.scss
index 50b04eb3f..c61b855d6 100644
--- a/app/src/assets/scss/util/_responsive.scss
+++ b/app/src/assets/scss/util/_responsive.scss
@@ -78,4 +78,10 @@
       }
     }
   }
+
+  .export-img__space {
+    flex: auto;
+    height: 8px;
+    width: 100%;
+  }
 }
diff --git a/app/src/protyle/export/util.ts b/app/src/protyle/export/util.ts
index 5bc25fa4c..1f0de91d0 100644
--- a/app/src/protyle/export/util.ts
+++ b/app/src/protyle/export/util.ts
@@ -46,7 +46,7 @@ export const exportImage = (id: string) => {
         <span class="fn__space"></span>
         <input id="watermark" class="b3-switch fn__flex-center" type="checkbox" ${window.siyuan.storage[Constants.LOCAL_EXPORTIMG].watermark ? "checked" : ""}>
     </label>
-    <span class="fn__flex-1"></span>
+    <span class="fn__flex-1 export-img__space"></span>
     <button disabled class="b3-button b3-button--cancel">${window.siyuan.languages.cancel}</button><div class="fn__space"></div>
     <button disabled class="b3-button b3-button--text">${window.siyuan.languages.confirm}</button>
 </div>
@@ -65,7 +65,9 @@ export const exportImage = (id: string) => {
         setStorageVal(Constants.LOCAL_EXPORTIMG, window.siyuan.storage[Constants.LOCAL_EXPORTIMG]);
         setTimeout(() => {
             addScript("/stage/protyle/js/html2canvas.min.js?v=1.4.1", "protyleHtml2canvas").then(() => {
-                window.html2canvas(exportDialog.element.querySelector(".b3-dialog__content"), {useCORS: true}).then((canvas) => {
+                window.html2canvas(exportDialog.element.querySelector(".b3-dialog__content"), {
+                    useCORS: true,
+                }).then((canvas) => {
                     canvas.toBlob((blob: Blob) => {
                         const formData = new FormData();
                         formData.append("file", blob, btnsElement[1].getAttribute("data-title"));
@@ -186,10 +188,13 @@ export const exportImage = (id: string) => {
             item.innerHTML = symbolElements[symbolElements.length - 1].innerHTML;
         });
         previewElement.querySelectorAll(".img img").forEach((item: HTMLImageElement) => {
-            if (item.src.endsWith(".svg")) {
+            const imgSrc = item.getAttribute("src")
+            if (imgSrc.endsWith(".svg")) {
                 fetchGet(item.src, (response: string) => {
                     item.src = `data:image/svg+xml;base64,${btoa(unescape(encodeURIComponent(response)))}`;
                 });
+            } else if (imgSrc.startsWith("assets/")) {
+                item.src = location.origin + "/" + imgSrc;
             }
         });
         updateWatermark();