Концы линий

В SVG можно указывать, как ведёт себя обводка на концах линий, это делается с помощью свойства stroke-linecap. В примерах ниже мы добавили вспомогательные светлые линии с обводкой и показали возможные значения свойства stroke-linecap:

1. butt — значение по умолчанию. С этим значением обводка просто заканчивается на концах линии:

2. round, с этим значением обводка равномерно закругляется вокруг концов линии:

3. square, с этим значением вокруг концов линии добавляется дополнительная обводка с прямоугольными краями:

В CSS внешним видом обводки на концах линий можно управлять с помощью аналогичного свойства stroke-linecap.