HTML canvas(画布)clip()方法

• 

  clip()方法定义和用法

  clip()方法从原始画布剪切任何形状和大小的区域。
  提示：剪切区域后，将来的所有绘图都将限制为剪切区域（无法访问画布上的其他区域）。但是，在使用clip()方法之前，可以使用save()方法保存当前画布区域，并在将来的任何时候将其恢复（使用restore()方法）。

• 

  clip()方法浏览器支持

  Internet Explorer	Chrome	FireFox	Safari	Opera
  9.0（含）以上	支持	支持	支持	支持

• 

  clip()方法语法

  context.clip();

• 

  clip()方法实例

  var c = document.getElementById("myCanvas2");
  var ctx = c.getContext("2d");
  // Clip a rectangular area
  ctx.rect(50, 20, 200, 120);
  ctx.stroke();
  ctx.clip();
  // Draw red rectangle after clip()
  ctx.fillStyle = "red";
  ctx.fillRect(0, 0, 150, 100);

  复制

  尝试一下
• 

  clip()方法参数值

  参数	描述
  无参数

• 

  clip()方法相关页面

  HTML教程：HTML脚本

  HTML教程：HTML画布