css - 更改图表 Mermaid 中链接上的文本字体

Question

我想更改链接上文本的字体(颜色、大小...)(Change_font)，但我无法弄清楚。有人可以帮忙吗？

<script src="https://cdnjs.cloudflare.com/ajax/libs/mermaid/9.0.1/mermaid.min.js"></script>

<div class="mermaid">
  graph TD;
  A[Hello]--Change_font-->B[of_text]
</div>

Answer 1

您可以使用linkStyle设置该行文本的样式，还将原始代码从 graph 更新为 flowchart .

<script src="https://cdnjs.cloudflare.com/ajax/libs/mermaid/9.0.1/mermaid.min.js"></script>

<div class="mermaid">
flowchart TB
    %% Colors %%
    classDef blue fill:#2374f7,stroke:#000,stroke-width:2px,color:#fff
    classDef green fill:#16b552,stroke:#000,stroke-width:2px,color:#fff

    A[Hello]:::blue ---> |Change_font| B[of_text]:::green

    %% Link Color %%
    linkStyle 0 stroke:blue,stroke-width:2px,color:red;
</div>