歡迎使用 wiki david888 線上 Markdown 編輯器

# 歡迎使用 `wiki david888` 線上 Markdown 編輯器 ## 如何使用 **微注**：清空目前這份預設文件，即處於可使用。預設為[所見即所得]模式，可通過 `⌘-⇧-M`（`Ctrl-⇧-M`）進行切換；或通過以下方式： - 所見即所得：`⌘-⌥-7`（`Ctrl-alt-7`）； - 分屏渲染：`⌘-⌥-9`（`Ctrl-alt-9`）； ### PPT 預覽如果您用作 `PPT` 預覽（入口在`設定`中），需要注意，這裡暫還不能支援各種圖表的渲染；您可以使用 `---` 來定義水平方向上幻燈片，用 `--` 來定義垂直幻燈片。 --- ## 什麼是 Markdown `Markdown` 是一種方便記憶、書寫的純文本標記語言，使用者可以使用這些標記符號，以最小的輸入代價，生成極富表現力的文件：譬如您正在閱讀的這份文件。它使用簡單的符號標記不同的標題，分割不同的段落，**粗體**、*斜體* 或者[超文本連結](https://david888.com)，更棒的是，它還可以： --- ### 1. 製作待辦事宜 `Todo` 列表 - [x] 🎉 通常 `Markdown` 解析器自帶的基本功能； - [x] 🍀 支援**流程圖**、**甘特圖**、**時序圖**、**任務列表**； - [x] 🏁 支援貼上 HTML 自動轉換為 Markdown； - [x] 💃🏻 支援插入原生 Emoji、設定常用表情列表； - [x] 🚑 支援編輯內容儲存**本地儲存**，防止意外丟失； - [x] 📝 支援**即時預覽**，主視窗大小拖拽，字元計數； - [x] 🛠 支援常用快捷鍵(**Tab**)，及程式碼塊新增複製 - [x] ✨ 支援**匯出**攜帶樣式的 PDF、PNG、JPEG 等； - [x] ✨ 升級 Vditor，新增對 `echarts` 圖表的支援； - [x] 👏 支援檢查並格式化 Markdown 語法，使其專業； - [x] 🦑 支援五線譜、及[部分站點、影片、音訊解析]； - [x] 🌟 增加對**所見即所得**編輯模式的支援(`⌘-⇧-M`)； --- ### 2. 書寫一個質能守恆公式[^LaTeX] $$ E=mc^2 $$ --- ### 3. 高亮一段程式碼[^code] ```js // 給頁面裡所有的 DOM 元素新增一個 1px 的描邊（outline）; [].forEach.call($$("*"),function(a){ a.style.outline="1px solid #"+(~~(Math.random()*(1<<24))).toString(16); }) ``` --- ### 4. 高效繪製[流程圖](https://github.com/knsv/mermaid#flowchart) ```mermaid graph TD A[使用者請求] --> B[語義解析] B --> C[RAG檢索] C -->|✅ 知識庫匹配| D[上下文增強] C -->|❌ 無匹配| E[任務分解] D --> E E --> F{工具選擇} F -->|🛠️ 核心工具| G{基礎操作} F -->|🔌 MCP擴充套件服務| H{MCP操作} G -->|✏️ 檔案操作| I[讀寫/替換] G -->|🖥️ 系統命令執行| J[執行命令] G -->|🔍 程式碼分析| K[程式碼分析] H -->|⚙️ 使用MCP工具| L[使用MCP工具] H -->|📦 訪問MCP資源| M[訪問MCP資源] I --> N[結果驗證] J --> N K --> N L --> N M --> N N --> O{完成判斷} O -->|✅| P[提交最終結果] O -->|❌| E ``` --- ### 5. 高效繪製[序列圖](https://github.com/knsv/mermaid#sequence-diagram) ```mermaid sequenceDiagram participant Alice participant Bob Alice->John: Hello John, how are you? loop Healthcheck John->John: Fight against hypochondria end Note right of John: Rational thoughts <br/>prevail... John-->Alice: Great! John->Bob: How about you? Bob-->John: Jolly good! ``` --- ### 6. 高效繪製[甘特圖](https://github.com/knsv/mermaid#gantt-diagram) > **甘特圖**內在思想簡單。基本是一條線條圖，橫軸表示時間，縱軸表示活動（專案），線條表示在整個期間上計劃和實際的活動完成情況。它直觀地表明任務計劃在什麼時候進行，及實際進展與計劃要求的對比。 ```mermaid gantt title 專案開發流程 section 專案確定需求分析 :a1, 2019-06-22, 3d 可行性報告 :after a1, 5d 概念驗證 : 5d section 專案實施概要設計 :2019-07-05 , 5d 詳細設計 :2019-07-08, 10d 編碼 :2019-07-15, 10d 測試 :2019-07-22, 5d section 釋出驗收釋出: 2d 驗收: 3d ``` ### 7. 支援圖表 ```echarts { "backgroundColor": "#212121", "title": { "text": "「某某站」訪問來源", "subtext": "2019 年 6 月份", "x": "center", "textStyle": { "color": "#f2f2f2" } }, "tooltip": { "trigger": "item", "formatter": "{a} <br/>{b} : {c} ({d}%)" }, "legend": { "orient": "vertical", "left": "left", "data": [ "搜尋引擎", "直接訪問", "推薦", "其他", "社交平臺" ], "textStyle": { "color": "#f2f2f2" } }, "series": [ { "name": "訪問來源", "type": "pie", "radius": "55%", "center": [ "50%", "60%" ], "data": [ { "value": 10440, "name": "搜尋引擎", "itemStyle": { "color": "#ef4136" } }, { "value": 4770, "name": "直接訪問" }, { "value": 2430, "name": "推薦" }, { "value": 342, "name": "其他" }, { "value": 18, "name": "社交平臺" } ], "itemStyle": { "emphasis": { "shadowBlur": 10, "shadowOffsetX": 0, "shadowColor": "rgba(0, 0, 0, 0.5)" } } } ] } ``` > **備註**：上述 echarts 圖表📈，其資料，須使用嚴格的 **JSON** 格式；您可使用 JSON.stringify(data)，將物件傳換從而得標準資料，即可正常使用。 --- ### 8. 繪製表格 | 作品名稱 | 線上地址 | 上線日期 | | :-------- | :----- | :----: | | blog | https://blog.david888.com |2026-02-01| | cv | https://david888.com |2026-02-01| --- ### 9. 更詳細語法說明總而言之，不同於其它**所見即所得**的編輯器：你只需使用鍵盤專注於書寫文本內容，就可以生成印刷級的排版格式，省卻在鍵盤和工具欄之間來回切換，調整內容和格式的麻煩。**Markdown 在流暢的書寫和印刷級的閱讀體驗之間找到了平衡。** 目前它已經成為世界上最大的技術分享網站 `GitHub` 和技術問答網站 `StackOverFlow` 的御用書寫格式，而且越發流行，正在在向各行業滲透。最新更新於 2026.07.13