我们的志愿者还没有将这篇文章翻译为 中文 (简体) 。加入我们帮助完成翻译！
Getting started
This tutorial will help get you started using SVG paths.
This tutorial will help get you started using SVG paths.
Summary
The path element is the generic element to define a shape. All the basic shapes can be created with a path element.
Usage context
| Categories | Graphics element, Shape element |
|---|---|
| Permitted content | Any number of the following elements, in any order: Animation elements » Descriptive elements » |
| Normative document | SVG 1.1 (2nd Edition) |
Example
<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>
Live result:
Attributes
Global attributes
- Conditional processing attributes »
- Core attributes »
- Graphical event attributes »
- Presentation attributes »
classstyleexternalResourcesRequiredtransform
Specific attributes
DOM_Interface
This element implements the SVGPathElement interface.
Browser compatibility
| 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) | Not supported | (Yes) | 3.0.4 |
The chart is based on these sources.