이 문서는 아직 자원 봉사자들이 한국어로 번역하지 않았습니다. 참여해서 번역을 마치도록 도와 주세요!
English (US)의 문서도 읽어보세요.

The filter attribute specifies the filter effects defined by the <filter> element that shall be applied to its element.

Note: As a presentation attribute, filter can be used as a CSS property. See css filter for further information.

As a presentation attribute, it can be applied to any element but it only has effect on container elements without the <defs> element, all graphics elements and the <use> element.

<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
  <filter id="blur">
    <feGaussianBlur stdDeviation="2" />
  </filter>

  <rect x="10" y="10" width="80" height="80" filter="url(#blur)" />
</svg>

Usage notes

Value none | <filter-function-list>
Default value none
Animatable Yes

For a description of the values see the css filter property.

Specifications

Specification Status Comment
Filter Effects Module Level 1
The definition of 'filter' in that specification.
Working Draft Extended the values by several special filter functions.
Scalable Vector Graphics (SVG) 1.1 (Second Edition)
The definition of 'filter' in that specification.
Recommendation Initial definition

Browser compatibility

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidEdge MobileFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
filterChrome ? Edge ? Firefox ? IE ? Opera ? Safari ? WebView Android ? Chrome Android ? Edge Mobile ? Firefox Android ? Opera Android ? Safari iOS ? Samsung Internet Android ?

Legend

Compatibility unknown  
Compatibility unknown

See also

문서 태그 및 공헌자

최종 변경자: MarleDK,