代碼

<svg  version="1.1" width="500" height="500">
    <path d="M 0 50 0 100" stroke="black"  fill="none" />
     <path d="M 50 50 A 5 5 0 0 1 45 55 " stroke="black"  fill="none" />
    <path d="M 150 50 150 95 A 5 5 0 0 1 145 100 " stroke="black"  fill="none" />
    <path d="M 250 50 250 95 A 5 5 0 0 1 245 100 L225 100" stroke="black"  fill="none" />
    <path d="M 350 50 350 95 A 5 5 0 0 1 345 100 L325 100 A 5 5 0 0 0 320 105" stroke="black"  fill="none" />
    <path d="M 450 50 450 95 A 5 5 0 0 1 445 100 L425 100 A 5 5 0 0 0 420 105 L420 150" stroke="black"  fill="none" />
</svg>

效果圖

image.png

參數(shù)說明

M

M代表開始移動
M0 0指從坐標(biāo)0，0開始移動

L

L代表直線
M0 0 L 100 100指畫一條坐標(biāo)0，0到坐標(biāo)100，100的直線

A

A代表弧形
參數(shù)有七個數(shù)值，代表不同的意思

1. rx（畫出半圓中唯一一條弧線所需的半徑）
2. ry（同上，rx不等于ry時為橢圓）
3. 順時針角度（rx、ry相等時設(shè)置無效）
4. 1大弧0小?。ㄊ褂胷x、ry所畫出的圓中兩點之間的一側(cè)大弧弧度還是一側(cè)小狐弧度），示例中參數(shù)使用的0
5. 1順時針0逆時針（rx、ry所畫的弧度是按照順時針方向放置還是逆時針方向放置即圓弧在半圓兩條線交叉角度中是外凸還是內(nèi)凹）
6. 下邊連線點即終點，X坐標(biāo)
7. 下邊連線點即終點，Y坐標(biāo)
   A 5 5 0 0 1 45 55 指畫一個坐標(biāo)5，5到45，55 的弧形