Bezier curve in CSS? -
Is there a way to get it into CSS? As you can see in Bella, I am using canvas to add a staff bottom section to the window control handle with this code:
ctx.beginPath (); Ctx.moveTo (20,0); Ctx.bezierCurveTo (25,15,0,10, -1, 35); Ctx.strokeStyle = "# 000" ctx.lineWidth = 4; Ctx.stroke (); Ctx.lineTo (-1.0); Ctx.lineTo (300,0); Ctx.fillStyle = "# 222" ctx.fill (); Ctx.closePath (); But it does not look very good. It is blurred and does not line up completely if I can use CSS then it will be crisp.
The closest you can just come to the CSS is something: Based on the work of someone I have a lot of time First seen and saved for reference. It's best to use the canvas, I think, and just try to make the edges smooth and fiddle with it.
#curves div {width: 100px; Height: 100 pixels; Limit: 1px solid black; } # Curves.width div {border color: transparent transparent black; } # Curve 5 {boundary-radius: 60px 0 0 0; } & lt; Div id = "curves" class = "width" & gt; & Lt; Div id = "curve5" & gt; & Lt; / Div & gt; & Lt; / Div & gt; To find out how to do this in Canvas SVG, visit this page:
Comments
Post a Comment