<filter>
Baseline
Widely available
*
This feature is well established and works across many devices and browser versions. It’s been available across browsers since Juli 2015.
* Some parts of this feature may have varying levels of support.
Das <filter> SVG-Element definiert einen benutzerdefinierten Filtereffekt, indem es atomare Filterprimitiven gruppiert. Es wird niemals selbst gerendert, muss jedoch vom filter Attribut auf SVG-Elementen oder der filter CSS-Eigenschaft für SVG/HTML-Elemente verwendet werden.
Verwendungskontext
| Kategorien | Keine |
|---|---|
| Erlaubter Inhalt | Beliebige Anzahl folgender Elemente, in beliebiger Reihenfolge: Beschreibende Elemente Primitive Filterelemente <animate>, <discard>, <set> |
Attribute
xywidthheightfilterUnitsprimitiveUnitsxlink:hrefVeraltet
DOM-Schnittstelle
Dieses Element implementiert die SVGFilterElement-Schnittstelle.
Beispiel
>SVG
html
<svg width="230" height="120" xmlns="http://www.w3.org/2000/svg">
<filter id="blurMe">
<feGaussianBlur stdDeviation="5" />
</filter>
<circle cx="60" cy="60" r="50" fill="green" />
<circle cx="170" cy="60" r="50" fill="green" filter="url(#blurMe)" />
</svg>
Ergebnis
Spezifikationen
| Specification |
|---|
| Filter Effects Module Level 1> # FilterElement> |
Browser-Kompatibilität
Loading…