使用canvas画圆角矩形 （4条边， 4个角）
ctx.moveTo 先设置起点A点 下面的（x,y）是B点， （x1, y1）是C点 方向，往哪边边拐
ctx.arcTo(x, y, x1, y1, 圆角大小) B点是A点与C点在圆弧上切线的交点，
<canvas id="can" width="500" height="300"></canvas>
<script> var canvas = document.getElementById('can'); var ctx = canvas.getContext("2d"); ctx.moveTo(100, 110); // 设置起点，为啥y轴要110.， 因为拐角的为10，所以往下移动10个像素单位 ctx.arcTo(100, 200, 200, 200, 10); // 确定好第一个点后， 第二个点是沿着y轴，向下，并且C点是严重水平轴，拐角大小为10个单位， 其他三个都是一样的道理 ctx.arcTo(200, 200, 200, 100, 10); ctx.arcTo(200, 100, 100, 100, 10); ctx.arcTo(100, 100, 100, 200, 10); ctx.stroke(); </script>
结果如下：
