SVG 路径是用于描述图形的最强大和灵活的方法之一。路径由一系列的命令组成，这些命令告诉浏览器如何绘制图形。每个命令包含一个字母和一组参数，用来指定操作类型和操作所需的数据。
基本路径命令
SVG 路径命令包括以下基本命令：
- M：移动到指定的坐标
- L：从当前点绘制一条直线到指定的坐标
- H：从当前点绘制一条水平线到指定的 x 坐标
- V：从当前点绘制一条垂直线到指定的 y 坐标
- C：绘制一个三次贝塞尔曲线
- S：绘制一个光滑的三次贝塞尔曲线
- Q：绘制一个二次贝塞尔曲线
- T：绘制一个光滑的二次贝塞尔曲线
- A：绘制一个椭圆弧
示例代码
下面是一个简单的 SVG 路径示例，绘制一个带有圆角的矩形：
-- -------------------- ---- -------
---- ----------- ------------ -----------------------------------
----- ---- -- --
- -- --
- -- -- - - - --- --
- --- --
- -- -- - - - -- --
- -- --
- -- -- - - - - --
- - --
- -- -- - - - -- --
-- ----------- ----------------
------在上面的示例中，我们使用了 M、L 和 A 命令来绘制一个带有圆角的矩形。首先我们移动到 (10, 10) 点，然后绘制一条水平线到 (90, 10) 点，接着绘制一个椭圆弧，最后闭合路径。
总结
SVG 路径是一种强大的工具，可以用来创建各种复杂的图形。熟练掌握路径命令是成为优秀的 SVG 开发者的关键。希望通过本章节的介绍，你对 SVG 路径有了更深入的理解。