更改图表美人鱼中链接上的文本字体答案

【问题标题】：Change font of text on links in graph Mermaid更改图表美人鱼中链接上的文本字体
【发布时间】：2022-05-02 14:36:36
【问题描述】：

我想更改链接 (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>

【问题讨论】：

标签： css graph mermaid

【解决方案1】：

样式链接

linkStyle 0 stroke-width:2px,fill:green,stroke:green;

完整的 API 文档链接 https://unpkg.com/mermaid@7.0.3/dist/www/flowchart.html#styling-and-classes

【讨论】：

【解决方案2】：

你可以用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>

【讨论】：