Ehkä olet kuullut CSS-suodattimista? Voit käyttää niitä tekemällä minkä tahansa elementin CSS: stä, kuten:
.apply-css-filter ( -webkit-filter: grayscale(0.5); filter: grayscale(0.5); )Voit jopa soveltaa sitä HTML-elementtiin tai SVG-elementtiin.
Mutta SVG: ssä on myös suodattimia, jotka voit määrittää, ja on enemmän vaihtoehtoja, kun teet. Tässä on esimerkki määritelmästä:
Sen jälkeen voit käyttää sitä suoraan SVG: n elementtiin, kuten:
Tai CSS: stä viittaamalla tunnukseen samalla tavalla:
.apply-svg-filter ( -webkit-filter: url(#pictureFilter); filter: url(#pictureFilter); )SVG-suodattimia on paljon. Tutut, kuten sumea, ja outoja, jotka käyttävät maalauksellisia vaikutuksia. Tässä on tekniset tiedot.