直接用
元素 +
属性就能画，但写错一个字母或坐标顺序，路径就消失、错位或缩成一个点——这不是浏览器问题，是命令解析中断了。
path 的 d 属性必须按「命令+坐标」严格拼接
不是自由字符串，而是浏览器逐字符解析的指令流。M 后必须跟两个数字，C 后必须跟六位数字（两组控制点+终点），Z 后不能跟任何数字。大小写敏感：大写是绝对坐标，小写是相对当前点偏移。
常见错误：
—— Z 后多写了坐标，Z 之后的
会被忽略，但后续命令若存在，可能因解析错位而失效
漏空格也危险：
在部分旧浏览器中会解析失败；稳妥写法是
或
相对命令（如
,
）依赖上一坐标，首次使用前没
就会从 (0,0) 开始，图形常“飞走”
画直线/三角形/闭合图形用 M + L + Z 最稳
这是入门最不易出错的组合，适合图标、箭头、多边形等。所有坐标用大写命令，位置完全可控。
：画笔移到 (50, 50)
：画直线到 (150, 50)
：再画直线到 (100, 150)
：自动连回起点 (50, 50)，闭合路径
完整示例：
立即学习
“
前端免费学习笔记（深入）
”；
使用HTML,CSS,JavaScript开发Android应用程序 英文文字pdf版附源文件
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
下载
画曲线优先选 Q（二次贝塞尔）而非 C（三次）
Q 只需一个控制点，参数少、易调试；C 要两个控制点，稍一调错就严重变形。手绘感、弧线图标、简单波浪线用 Q 足够。
：从当前点出发，以 (cx, cy) 为控制点，落到 (x, y)
控制点越远，曲线越“甩”；靠近终点，曲线越平缓
示例（拱桥）：
—— 起点(0,100)，终点(400,100)，控制点在正上方(200,0)
圆/椭圆别硬算贝塞尔，用 A 命令更准且简洁
想画标准圆弧、饼图切片、进度环？别拆成 4 段 C 曲线。A 命令原生支持椭圆弧，参数虽多但逻辑清晰：起点→半径→旋转→大弧/小弧→顺/逆时针→终点。
关键参数：
表示≤180°弧，
表示顺时针画弧
画半圆（右半）示例：
—— 从(100,100)出发，x/y半径都是50，不旋转，大弧，顺时针，终点(100,200)
真正容易被忽略的是：A 命令的起点必须由前面的 M/L 等命令明确给出，它自己不定义起点；而且前后两点距离不能超过两倍半径，否则解析失败静默跳过。
ddd="M10 10 L20 20 Z50 50"50 50d="M10,10L20,20"M 10 10 L 20 20M 10,10 L 20,20lcMM 50 50L 150 50L 100 150ZQ cx cy x yM 0 100 Q 200 0 400 100A rx ry x-axis-rotation large-arc sweep x ylarge-arc=0sweep=1M 100 100 A 50 50 0 1 1 100 200