how to apply border radius to canvas element like div to make it circle?-CodePudding

i want to make canvas element circle like other any div but its not working. here is my code . please have a loot at code. what am doing wrong with border-radius propoerty ?

<canvas id="myCanvas" width="200" height="200" style="background-color:red;border:1px solid;border-radius:50%">

border-radius property is not working like i apply on div. actually, i want to create rectangle , square and circle of canvas. please anyone can help me

CodePudding user response：

Your code looks fine. Border radius should do it however if you are using JavaScript this method might help:

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.beginPath();
ctx.arc(100, 75, 50, 0, 2 * Math.PI);
ctx.stroke();