Mermaid 实用教程【转】

#mermaid-svg-VpjSgxRzCC6jw3ZX {font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}#mermaid-svg-VpjSgxRzCC6jw3ZX .error-icon{fill:#552222;}#mermaid-svg-VpjSgxRzCC6jw3ZX .error-text{fill:#552222;stroke:#552222;}#mermaid-svg-VpjSgxRzCC6jw3ZX .edge-thickness-normal{stroke-width:2px;}#mermaid-svg-VpjSgxRzCC6jw3ZX .edge-thickness-thick{stroke-width:3.5px;}#mermaid-svg-VpjSgxRzCC6jw3ZX .edge-pattern-solid{stroke-dasharray:0;}#mermaid-svg-VpjSgxRzCC6jw3ZX .edge-pattern-dashed{stroke-dasharray:3;}#mermaid-svg-VpjSgxRzCC6jw3ZX .edge-pattern-dotted{stroke-dasharray:2;}#mermaid-svg-VpjSgxRzCC6jw3ZX .marker{fill:#333333;stroke:#333333;}#mermaid-svg-VpjSgxRzCC6jw3ZX .marker.cross{stroke:#333333;}#mermaid-svg-VpjSgxRzCC6jw3ZX svg{font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;}#mermaid-svg-VpjSgxRzCC6jw3ZX .label{font-family:"trebuchet ms",verdana,arial,sans-serif;color:#333;}#mermaid-svg-VpjSgxRzCC6jw3ZX .cluster-label text{fill:#333;}#mermaid-svg-VpjSgxRzCC6jw3ZX .cluster-label span{color:#333;}#mermaid-svg-VpjSgxRzCC6jw3ZX .label text,#mermaid-svg-VpjSgxRzCC6jw3ZX span{fill:#333;color:#333;}#mermaid-svg-VpjSgxRzCC6jw3ZX .node rect,#mermaid-svg-VpjSgxRzCC6jw3ZX .node circle,#mermaid-svg-VpjSgxRzCC6jw3ZX .node ellipse,#mermaid-svg-VpjSgxRzCC6jw3ZX .node polygon,#mermaid-svg-VpjSgxRzCC6jw3ZX .node path{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#mermaid-svg-VpjSgxRzCC6jw3ZX .node .label{text-align:center;}#mermaid-svg-VpjSgxRzCC6jw3ZX .node.clickable{cursor:pointer;}#mermaid-svg-VpjSgxRzCC6jw3ZX .arrowheadPath{fill:#333333;}#mermaid-svg-VpjSgxRzCC6jw3ZX .edgePath .path{stroke:#333333;stroke-width:2.0px;}#mermaid-svg-VpjSgxRzCC6jw3ZX .flowchart-link{stroke:#333333;fill:none;}#mermaid-svg-VpjSgxRzCC6jw3ZX .edgeLabel{background-color:#e8e8e8;text-align:center;}#mermaid-svg-VpjSgxRzCC6jw3ZX .edgeLabel rect{opacity:0.5;background-color:#e8e8e8;fill:#e8e8e8;}#mermaid-svg-VpjSgxRzCC6jw3ZX .cluster rect{fill:#ffffde;stroke:#aaaa33;stroke-width:1px;}#mermaid-svg-VpjSgxRzCC6jw3ZX .cluster text{fill:#333;}#mermaid-svg-VpjSgxRzCC6jw3ZX .cluster span{color:#333;}#mermaid-svg-VpjSgxRzCC6jw3ZX div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:12px;background:hsl(80, 100%, 96.2745098039%);border:1px solid #aaaa33;border-radius:2px;pointer-events:none;z-index:100;}#mermaid-svg-VpjSgxRzCC6jw3ZX :root{--mermaid-font-family:"trebuchet ms",verdana,arial,sans-serif;} #mermaid-svg-VpjSgxRzCC6jw3ZX {font-family:"trebu