<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg">
<!-- 路径 -->
<path d="M10 80 Q 95 10 180 80" fill="none" stroke="black" />
</svg>
在这个例子中：
- 使用 <svg> 元素定义了SVG图形的画布，设置了宽度（width）和高度（height）。
- 使用 <path> 元素定义了一个路径，通过 d 属性设置路径的数据。
- M 表示移动到（Move To）指定的坐标，Q 表示二次贝塞尔曲线，依次指定了控制点和终点。
- fill 属性设置为 "none" 表示不填充颜色，stroke 属性设置了路径的描边颜色为黑色。
路径的 d 属性包含了一系列的路径命令，每个命令后面可以跟随坐标参数。以下是一个更复杂的例子，绘制了一个包含直线、水平线、垂直线和弧线的路径：
<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg">
<!-- 复杂路径 -->
<path d="M10 80 L 40 10 H 80 V 80 A 20 20 0 0 1 10 80 Z" fill="orange" stroke="purple" />
</svg>
在这个例子中，路径的数据中包含了 L（Line To）表示直线，H（Horizontal Line To）表示水平线，V（Vertical Line To）表示垂直线，A（Arc）表示弧线。这个路径的起点是 (10,80)，通过一系列命令连接到最终的闭合点 (10,80)。填充颜色为橙色，描边颜色为紫色。
你可以根据需要调整路径的数据以及填充和描边的样式。SVG路径是非常灵活的，可以用来绘制各种复杂的形状。
转载请注明出处：http://www.pingtaimeng.com/article/detail/14674/SVG