diff --git a/packages/mini-markdown-ast-parser/src/core/transform/render/list.ts b/packages/mini-markdown-ast-parser/src/core/transform/render/list.ts
index 5d51dacf23cdc1ecb91ce572490b9c0292a2a155..0a83805ed39ce7f4a7dd501d23737b9ea0cfd3e5 100644
--- a/packages/mini-markdown-ast-parser/src/core/transform/render/list.ts
+++ b/packages/mini-markdown-ast-parser/src/core/transform/render/list.ts
@@ -1,7 +1,8 @@
 import { Tokens } from "@/types/tokens";
 import { astToHtml } from "..";
+import { prefix } from "@/common/constant";
 
 export const renderList = (node: Tokens) => {
   const listType = node.ordered ? "ol" : "ul";
-  return `<${listType} data-line="${node.position.start.line}">${node.children?.map(astToHtml).join("")}</${listType}>`;
+  return `<${listType} data-line="${node.position.start.line}" class="${prefix}-${listType}">${node.children?.map(astToHtml).join("")}</${listType}>`;
 };
diff --git a/packages/mini-markdown-editor/package.json b/packages/mini-markdown-editor/package.json
index 824cbef00515b5afa36e2265c05ac1b9500a52b7..dd751c4ae54bc7238ece8474fc5eed53221d486e 100644
--- a/packages/mini-markdown-editor/package.json
+++ b/packages/mini-markdown-editor/package.json
@@ -19,6 +19,7 @@
     "ahooks": "^3.8.4",
     "antd": "^5.23.2",
     "highlight.js": "^11.11.1",
+    "html2pdf.js": "^0.10.2",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-hotkeys-hook": "^4.6.1"
diff --git a/packages/mini-markdown-editor/src/assets/styles/preview.css b/packages/mini-markdown-editor/src/assets/styles/preview.css
index dd022b9ad7a4986d6aa3f27d22d7dd893490bdf8..e73fea21d31e469b9ac923e4793c68b8cb666027 100644
--- a/packages/mini-markdown-editor/src/assets/styles/preview.css
+++ b/packages/mini-markdown-editor/src/assets/styles/preview.css
@@ -9,6 +9,7 @@
   padding: 0 10px;
   word-wrap: break-word;
   color: #3f4a54;
+  margin: 0.8em 0;
 }
 
 .mini-md-h1 {
@@ -106,6 +107,7 @@
 .mini-md-ul,
 .mini-md-ol {
   margin: 0.6em 0;
+  padding-inline-start: 30px;
 }
 
 .mini-md-li::marker {
diff --git a/packages/mini-markdown-editor/src/assets/styles/reset.css b/packages/mini-markdown-editor/src/assets/styles/reset.css
index 2eabf488265c55d665fb786163221c5c5ca0a2a3..45f760e48d48fcccdfa554482366fb8d3d4ca60a 100644
--- a/packages/mini-markdown-editor/src/assets/styles/reset.css
+++ b/packages/mini-markdown-editor/src/assets/styles/reset.css
@@ -1,3 +1,5 @@
 * {
+    margin: 0;
+    padding: 0;
     box-sizing: border-box;
 }
\ No newline at end of file
diff --git a/packages/mini-markdown-editor/src/mock/preview.md b/packages/mini-markdown-editor/src/mock/preview.md
index 02c72a43e42f1f77d481eefd398b1e7e6ec1105e..d25259c3b41705b88fb77869e42c53872766ed86 100644
--- a/packages/mini-markdown-editor/src/mock/preview.md
+++ b/packages/mini-markdown-editor/src/mock/preview.md
@@ -20,21 +20,21 @@ asd`code``code`asd--uder--~~bolang~~
 >
 > blockquote _bolang_
 
-![image](https://www.baidu.com/img/flexible/logo/pc/result@2.png)
-![image](https://www.baidu.com/img/flexible/logo/pc/result@2.png)
-![image](https://www.baidu.com/img/flexible/logo/pc/result@2.png)
-![image](https://www.baidu.com/img/flexible/logo/pc/result@2.png)
-![image](https://www.baidu.com/img/flexible/logo/pc/result@2.png)
-![image](https://www.baidu.com/img/flexible/logo/pc/result@2.png)
-![image](https://www.baidu.com/img/flexible/logo/pc/result@2.png)
-![image](https://www.baidu.com/img/flexible/logo/pc/result@2.png)
-![image](https://www.baidu.com/img/flexible/logo/pc/result@2.png)
-![image](https://www.baidu.com/img/flexible/logo/pc/result@2.png)
-![image](https://www.baidu.com/img/flexible/logo/pc/result@2.png)
-![image](https://www.baidu.com/img/flexible/logo/pc/result@2.png)
-![image](https://www.baidu.com/img/flexible/logo/pc/result@2.png)
-![image](https://www.baidu.com/img/flexible/logo/pc/result@2.png)
-![image](https://www.baidu.com/img/flexible/logo/pc/result@2.png)
+![image](https://picx.zhimg.com/v2-af0864722ad401dedda1e343d750fc28_r.jpg?source=1def8aca)
+![image](https://picx.zhimg.com/v2-af0864722ad401dedda1e343d750fc28_r.jpg?source=1def8aca)
+![image](https://picx.zhimg.com/v2-af0864722ad401dedda1e343d750fc28_r.jpg?source=1def8aca)
+![image](https://picx.zhimg.com/v2-af0864722ad401dedda1e343d750fc28_r.jpg?source=1def8aca)
+![image](https://picx.zhimg.com/v2-af0864722ad401dedda1e343d750fc28_r.jpg?source=1def8aca)
+![image](https://picx.zhimg.com/v2-af0864722ad401dedda1e343d750fc28_r.jpg?source=1def8aca)
+![image](https://picx.zhimg.com/v2-af0864722ad401dedda1e343d750fc28_r.jpg?source=1def8aca)
+![image](https://picx.zhimg.com/v2-af0864722ad401dedda1e343d750fc28_r.jpg?source=1def8aca)
+![image](https://picx.zhimg.com/v2-af0864722ad401dedda1e343d750fc28_r.jpg?source=1def8aca)
+![image](https://picx.zhimg.com/v2-af0864722ad401dedda1e343d750fc28_r.jpg?source=1def8aca)
+![image](https://picx.zhimg.com/v2-af0864722ad401dedda1e343d750fc28_r.jpg?source=1def8aca)
+![image](https://picx.zhimg.com/v2-af0864722ad401dedda1e343d750fc28_r.jpg?source=1def8aca)
+![image](https://picx.zhimg.com/v2-af0864722ad401dedda1e343d750fc28_r.jpg?source=1def8aca)
+![image](https://picx.zhimg.com/v2-af0864722ad401dedda1e343d750fc28_r.jpg?source=1def8aca)
+![image](https://picx.zhimg.com/v2-af0864722ad401dedda1e343d750fc28_r.jpg?source=1def8aca)
 
 - 1
   - asd
@@ -94,8 +94,8 @@ asd`code``code`asd--uder--~~bolang~~
 >
 > blockquote _bolang_
 
-![image](https://www.baidu.com/img/flexible/logo/pc/result@2.png)
-![image](https://www.baidu.com/img/flexible/logo/pc/result@2.png)
+![image](https://picx.zhimg.com/v2-af0864722ad401dedda1e343d750fc28_r.jpg?source=1def8aca)
+![image](https://picx.zhimg.com/v2-af0864722ad401dedda1e343d750fc28_r.jpg?source=1def8aca)
 
 
 - 1
diff --git a/packages/mini-markdown-editor/src/utils/output-pdf.ts b/packages/mini-markdown-editor/src/utils/output-pdf.ts
index 6c5c09a8f7066cbeaf554dc6f21af625df2b1954..ae717a0d9acff798002b5c91b3bc846f49f9df79 100644
--- a/packages/mini-markdown-editor/src/utils/output-pdf.ts
+++ b/packages/mini-markdown-editor/src/utils/output-pdf.ts
@@ -1,3 +1,25 @@
-export const exportPdf = async (element: HTMLElement, filename: string) => {
-  console.log(element, filename);
+import html2pdf from "html2pdf.js";
+
+export const exportPdf = (element: HTMLElement, filename: string) => {
+  return new Promise((resolve) => {
+    const options = {
+      margin: 10,
+      filename: filename,
+      image: { type: "jpeg", quality: 0.98 },
+      html2canvas: {
+        scale: 2,
+        useCORS: true,
+        allowTaint: true,
+        scrollX: -window.scrollX,
+        scrollY: -window.scrollY,
+        windowWidth: 2100,
+        windowHeight: 2970,
+        includeShadowDom: true,
+      },
+      jsPDF: { unit: "mm", format: "a4", orientation: "portrait" },
+    };
+
+    html2pdf().from(element).set(options).save();
+    resolve({});
+  });
 };
diff --git a/packages/mini-markdown-editor/src/vite-env.d.ts b/packages/mini-markdown-editor/src/vite-env.d.ts
index 11f02fe2a0061d6e6e1f271b21da95423b448b32..1f05dc78390cf82efb0d922d2bcd27f2c362d07f 100644
--- a/packages/mini-markdown-editor/src/vite-env.d.ts
+++ b/packages/mini-markdown-editor/src/vite-env.d.ts
@@ -1 +1,2 @@
 /// <reference types="vite/client" />
+declare module "html2pdf.js";