Unsere Freiwilligen haben diesen Artikel noch nicht in Deutsch übersetzt. Machen Sie mit und helfen Sie, das zu erledigen!
SVG allows graphical objects to be defined for later reuse. It is recommended that, wherever possible, referenced elements be defined inside of a <defs> element. Defining these elements inside of a <defs> element promotes understandability of the SVG content and thus promotes accessibility. Graphical elements defined in a <defs> element will not be directly rendered. You can use a <use> element to render those elements wherever you want on the viewport.
Usage context
| Categories | Container element, Structural element |
|---|---|
| Permitted content | Any number of the following elements, in any order: Animation elements Descriptive elements Shape elements Structural elements Gradient elements <a>, <altGlyphDef>, <clipPath>, <color-profile>, <cursor>, <filter>, <font>, <font-face>, <foreignObject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view> |
Attributes
Global attributes
- Conditional processing attributes
- Core attributes
- Graphical event attributes
- Presentation attributes
classstyleexternalResourcesRequiredtransform
Specific attributes
None
DOM Interface
This element implements the SVGDefsElement interface.
Example
<svg width="80px" height="30px" viewBox="0 0 80 30"
xmlns="https://www.w3.org/2000/svg">
<defs>
<linearGradient id="Gradient01">
<stop offset="20%" stop-color="#39F" />
<stop offset="90%" stop-color="#F3F" />
</linearGradient>
</defs>
<rect x="10" y="10" width="60" height="10"
fill="url(#Gradient01)" />
</svg>
Specifications
| Specification | Status | Comment |
|---|---|---|
| Scalable Vector Graphics (SVG) 2 The definition of '<defs>' in that specification. |
Candidate Recommendation | No change |
| Scalable Vector Graphics (SVG) 1.1 (Second Edition) The definition of '<defs>' in that specification. |
Recommendation | Initial definition |
Browser compatibility
| Feature | Chrome | Firefox (Gecko) | Internet Explorer | 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) | No support | (Yes) | 3.0.4 |
The chart is based on these sources.