mermaid_diagram_example.html
· 682 B · HTML
Brut
<!doctype html>
<html lang="zh-TW">
<head>
<meta charset="UTF-8" />
<title>Mermaid Diagram Example</title>
<!-- 載入 Mermaid CDN -->
<script src="https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.min.js"></script>
<script>
mermaid.initialize({ startOnLoad: true })
</script>
</head>
<body>
<h1>Mermaid Diagram</h1>
<!-- 將你的 Mermaid 原始碼放在這個 div 中 -->
<div class="mermaid">
flowchart TD
A[Christmas] -->|Get money| B(Go shopping)
B --> C{Let me think}
C -->|One| D[Laptop]
C -->|Two| E[iPhone]
C -->|Three| F[fa:fa-car Car]
</div>
</body>
</html>
| 1 | <!doctype html> |
| 2 | <html lang="zh-TW"> |
| 3 | <head> |
| 4 | <meta charset="UTF-8" /> |
| 5 | <title>Mermaid Diagram Example</title> |
| 6 | <!-- 載入 Mermaid CDN --> |
| 7 | <script src="https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.min.js"></script> |
| 8 | <script> |
| 9 | mermaid.initialize({ startOnLoad: true }) |
| 10 | </script> |
| 11 | </head> |
| 12 | <body> |
| 13 | <h1>Mermaid Diagram</h1> |
| 14 | <!-- 將你的 Mermaid 原始碼放在這個 div 中 --> |
| 15 | <div class="mermaid"> |
| 16 | flowchart TD |
| 17 | A[Christmas] -->|Get money| B(Go shopping) |
| 18 | B --> C{Let me think} |
| 19 | C -->|One| D[Laptop] |
| 20 | C -->|Two| E[iPhone] |
| 21 | C -->|Three| F[fa:fa-car Car] |
| 22 | </div> |
| 23 | </body> |
| 24 | </html> |
| 25 |