The clip-path attribute binds the element it is applied to with a given <clipPath> element
As a presentation attribute, it also can be used as a property directly inside a CSS stylesheet
| Categories | Presentation attribute |
|---|---|
| Value | <FuncIRI> | none | inherit |
| Animatable | Yes |
| Normative document | SVG 1.1 (2nd Edition) |
css uri. If the reference is not valid (e.g it points to an object that doesn't exist or the object is not a <clipPath> element) the clip-path attribute or property must be treated as if it hadn't been specified.clip-path as an attribute| Source code | Output result |
|---|---|
Unable to find file clip-path-1.svg | Unable to find file clip-path-1.svg |
clip-path as a CSS property| Source code | Output result |
|---|---|
Unable to find file clip-path-2.svg | Unable to find file clip-path-2.svg |
The following elements can use the clip-path attribute
© 2005–2018 Mozilla Developer Network and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/clip-path