CSS의 베 지어 곡선?

Question

CSS에서 이걸 얻을 수있는 방법이 있습니까? bezier effect?

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(); 

을하지만 아주 좋은 보이지 않는 : 당신이 코드로 윈도우 컨트롤 핸들에 curvey 바닥 섹션을 추가하기 위해 캔버스를 사용하고있는 바이올린에서 볼 수 있듯이. 그것은 흐릿하고 완전히 정렬되지 않습니다. CSS를 사용할 수 있다면 선명하게 보일 것입니다.

Answer 1

가장 가까운 CSS는 단지 해커 일뿐입니다. http://jsfiddle.net/TylerH/DaKFb/1/ 누군가의 작품을 바탕으로 오래전에 본 적이 있으며 참조 용으로 저장되었습니다. 캔버스를 사용하는 것이 가장 좋으며, 가장자리를 매끄럽게하려고 노력하면됩니다.

#curves div { 
 
    width: 100px; 
 
    height: 100px; 
 
    border: 1px solid black; 
 
} 
 

 
#curves.width div { 
 
    border-color: transparent transparent transparent black; 
 
} 
 

 
#curve5 { 
 
    border-radius: 60px 0 0 0; 
 
}

<div id="curves" class="width"> 
 
    <div id="curve5"></div> 
 
</div>

방문이 페이지 캔버스 SVG에서 작업을 수행하는 방법을 알아 : CSS에서 http://www.sitepoint.com/html5-svg-cubic-curves/