32: SVG filtri uz SVG un HTML elementiem - CSS-triki

Varbūt esat dzirdējuši par CSS filtriem? Jūs varat tos izmantot, izmantojot jebkuru CSS elementu, piemēram:

.apply-css-filter ( -webkit-filter: grayscale(0.5); filter: grayscale(0.5); )

Varat to pat pielietot HTML elementam vai SVG elementam.

Bet SVG var definēt arī filtrus, un, to darot, ir vairāk iespēju. Šeit ir definīcijas piemērs:

Pēc tam jūs varat to pielietot elementam tieši SVG, piemēram:

Vai arī no CSS, līdzīgi norādot ID:

.apply-svg-filter ( -webkit-filter: url(#pictureFilter); filter: url(#pictureFilter); )

Ir daudz SVG filtru. Pazīstamiem cilvēkiem patīk izplūšana un dīvaini, kas pieliek gleznieciskus efektus. Lūk, spec.