最适合网络开发者的网站
图。初学者课程

尿素

SVG <polyline>


SVG 折线 -<polyline>

示例 1

这<polyline>元素用于创建仅由直线组成(在几个点连接)的任何形状:

抱歉,您的浏览器不支持内联 SVG。

以下是 SVG 代码:

例子

<svg height="200" width="500">
  <polyline points="20,20 40,25 60,40 80,120 120,140 200,180"
样式="填充:无;描边:黑色;描边宽度:3" /&gt;
</svg>
亲自尝试 »

代码解释:

  • points 属性定义绘制折线所需的点列表(x 和 y 坐标对)

示例 2

另一个仅含直线的示例:

抱歉,您的浏览器不支持内联 SVG。

以下是 SVG 代码:

例子

<svg height="180" width="500">
  <polyline points="0,40 40,40 40,80 80,80 80,120 120,120 120,160"
样式="填充:白色;描边:红色;描边宽度:4" /&gt;
</svg>
亲自尝试 »