svg circle in html5

Question

how i can fill the circle with image ??I try the below code but its not work can anybody help me please ??

<svg width="2000" height="2000">
<circle cx="400" cy="400" r="300" style="fill:download.jpg; stroke:yellow; stroke-width:3;" />
</svg>

Answer 1

background-image : url('http://..../..jpg')

Answer 2

https://code.sololearn.com/WqaWe2xRKF9q/?ref=app

Answer 3

An image fill for an svg element is achieved through SVG Patterns.

<svg width="700" height="660">
<defs>
<pattern id="image" x="0" y="0" patternUnits="userSpaceOnUse" height="1" width="1">
<image x="0" y="0" xlink:href="url.png"></image>
</pattern>
</defs>
<circle id='top' cx="180" cy="120" r="80" fill="url(#image)"/>
</svg>

Answer 4

Check it out guy's
https://code.sololearn.com/W4lzcVDX6qOK/?ref=app
Super Man logo
Using SVG