本文主要包含图形,简单,制作等相关知识,匿名希望在学习及工作中可以帮助到您
圆形 circle
<svg width="200" height="200" >
<circle
cx="100"
cy="100"
r="80"
stroke="green"
stroke-width="4"
fill="none"/>
</svg>矩形 rect
<svg>
<rect
x="10"
y="10"
rx="5"
ry="5"
width="150"
height="100"
stroke="red"
fill="none">
</rect>
</svg>椭圆 ellipse
<svg>
<ellipse
cx="400"
cy="60"
rx="70"
ry="50"
stroke="red"
fill="none">
</ellipse>
</svg>线 line
<svg>
<line
x1="10"
y1="120"
x2="160"
y2="220"
stroke="red">
</line>
</svg>折线 polyline
<svg>
<line
x1="10"
y1="120"
x2="160"
y2="220"
stroke="red">
</line>
</svg>多边形 polygon
<svg>
<polygon
points="250 120
300 220
200 220"
stroke="red"
stroke-width="5"
fill="yellow"
transform="translate(150 0)">
</polygon>
</svg>路径 path
可用于路径数据的命令
M = moveto
L = lineto
H = horizontal lineto
V = vertical lineto
C = curveto
S = smooth curveto
Q = quadratic Belzier curve
T = smooth quadratic Belzier curveto
A = elliptical Arc
Z = closepath
<svg>
<path
d="M250 150 L150 350 L350 350 Z" />
</svg>以上就是SVG制作简单图形的实例介绍的详细内容，更多请关注微课江湖其它相关文章！