Inside svg graphics to insert a picture?

For example here is icon icon
how to dynamically insert a background typical picture? with the help of which it can be implemented ?
April 3rd 20 at 17:20
1 answer
April 3rd 20 at 17:22
Solution
https://css-tricks.com/clipping-masking-css/

<img class="clip-svg" src="harry.jpg" alt="Harry Potter">

<svg width="0" height="0">
<defs>
 <clipPath id="myClip">
 <circle cx="100" cy="100" r="40" />
 <circle cx="60" cy="60" r="40" />
</clipPath>
</defs>
</svg>


.clip-svg {
 clip-path: url(#myClip);
}
It is certainly cool. but it is not very crossbrowser - zachery commented on April 3rd 20 at 17:25
@zachery, https://caniuse.com/#feat=mdn-css_properties_clip-...
You need to support IE 9? - georgianna commented on April 3rd 20 at 17:28
@Dominick, I tried didn't work in ie 11. - zachery commented on April 3rd 20 at 17:31

Find more questions by tags CSSJavaScriptSVG