svg circle in html5 | Sololearn: Learn to code for FREE!

+1

svg circle in html5

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>

3/23/2019 5:58:42 AM

Sanaa Hareb

4 Answers

New Answer

+4

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

+4

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

+1

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>

-1

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