svg-tutorial

2019.6.11 svg

1.圆形

<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
  <circle cx="100" cy="50" r="40" stroke="black" stroke-width="2" fill="red" />
</svg>

circle标签:画圆

cx,cy是圆心坐标,不设置则默认0,0为圆心

r是圆的半径

stroke边框轮廓颜色

stroke-width边框轮廓宽度

fill图形填充色

2.矩形

<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
  <rect width="300" height="100" style="fill:rgb(0,0,255);stroke-width:1;stroke:rgb(0,0,0)"/>
</svg>

width和height为宽和高,即矩形的长(width)和宽(height)

style定义图形样式,样式内容同圆形一样

3.

更新列表:

参考文章:

[2]: [3]: [4]: [5]: [6]:

相关阅读