Как правильно пользоваться SVG?

#svg

К примеру надо сделать кнопки :


Наверно на svg это будет лучше , или :

Ответы

Ответ 1

откуда берут вот эти цифры ?:


Случай с polyline points самый простой. Тут просто задаются точки x,y.

polyline points="x1,y1  x2,y2  x3,y3   x4,y4 ...."


Пример:



Пример 1:


Пример 2:





Можно использовать path для этих целей.

path = "M x,y  L x1,y1 z"


M — moveto, обозначает начало новой линии — точку, с которой мы начинаем рисовать.

Z — closepath — замкнуть фигуру, при этом рисуется линия от текущей точки до начальной.
Действие этой команды не зависит от регистра, Z и z сработают одинаково.

L — lineto — рисование линии.

Больше информации у yoksel

Пример с path:








И еще одна полезная статья на хабре.