path - SVG 编辑

起步
本教程将教你开始使用SVG路径。

path元素是用来定义形状的通用元素。所有的基本形状都可以用path元素来创建。

用法

类别	图形元素, 形状元素
允许的内容物	任意数量、任意排序的下列元素： 动画元素 描述性元素

示例

<svg width="100%" height="100%" viewBox="0 0 400 400"
     xmlns="http://www.w3.org/2000/svg">

  <path d="M 100 100 L 300 100 L 200 300 z"
        fill="orange" stroke="black" stroke-width="3" />
</svg>

输出结果：

属性

全局属性

• 条件处理属性 »
• 核心属性 »
• 图形事件属性 »
• 外观属性 »
• class
• style
• externalResourcesRequired
• transform

专有属性

• d
• pathLength

DOM 接口

该元素实现了SVGPathElement接口。

浏览器兼容性

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

• Desktop
• Mobile

Feature	Chrome	Firefox (Gecko)	IE	Opera	Safari
Basic support	1.0	1.5 (1.8)	9.0	8.0	3.0.4

Feature	Android	Firefox Mobile (Gecko)	IE Phone	Opera Mobile	Safari Mobile
Basic support	3.0	1.0 (1.8)	未实现	(Yes)	3.0.4

该表格基于这些资源。

参见

• <circle>
• <ellipse>
• <line>
• <polygon>
• <polyline>
• <rect>
• The MDN SVG "Getting Started" tutorial : Path