太强了, 教你怎么在博客园 Markdown 使用SVG 矢量图

废话先不多说,直接上个图说明问题:

R1
R1
R2
R2
R5
R5
R3
R3
R4
R4
I
I
U
U
I5
I5
Is1
Is1
Is2
Is2
Is3
Is3

聪明的小伙伴当然选择直接查看网页源代码了

对就是网页源代码中,在博客园的 Markdown 格式的博客中,是可以解析一些 html 标签的,我用的就是简单的 <div> 与 <svg> 标签。通常的方法是下面这样的:

<table>
  <tr>
    <td>
      <svg width="140" height="170">
        <title>SVG Sample</title>
        <desc>This is a sample to use SVG in markdown on the website cnblogs.</desc>
        <circle cx="70" cy="95" r="50" style="stroke: black; fill: none;"/>
      </svg>
    </td>
  </tr>
</table>

或者是

<div width="100%" style="overflow-x: auto;"> 
  <svg width="140" height="170">
    <title>SVG Sample</title>
    <desc>This is a sample to use SVG in markdown on the website cnblogs.</desc>
    <circle cx="70" cy="95" r="50" style="stroke: black; fill: none;"/>
  </svg>
</div>

这样的
那么代码可以转 SVG, 那么 SVG 可不可以转代码呢?
这里我要吹爆 画图软件
对,他可以直接讲 SVG 以源代码的格式导出,画图的时候以 SVG 源代码格式导出,直接放在 <div> 标签里面,就可以了:


H
H
G
G
F
F
E
E
D
D
C
C
B
B
A
A
HA
HA
AB
AB
ABC
ABC
BC
BC
BCD
BCD
CD
CD
ED
ED
CDE
CDE
EF
EF
DEF
DEF
EFG
EFG
FG
FG
FGH
FGH
GH
GH
GHA
GHA
ABH
ABH
BDE
BDE
CDEF
CDEF
DEFG
DEFG
EFGH
EFGH
FGHA
FGHA
ABGH
ABGH
ABCH
ABCH
ABCD
ABCD
BCEF
BCEF
ABCGH
ABCGH
ABCDEFGH
ABCDEFGH

猜你喜欢

转载自www.cnblogs.com/wevolf/p/11025438.html
今日推荐