HTML |画布 fillRect() 方法

fillRect() 方法用于使用给定的颜色填充矩形。 fillRect() 方法的默认颜色是黑色。

句法：

context.fillRect( x, y, width, height )

参数：此方法接受上面提到和下面描述的四个参数：

• x：它存储矩形左上角的 x 坐标。
• y：存储矩形左上角的y坐标。
• 宽度：它以像素为单位存储宽度。
• 高度：它以像素为单位存储高度。

示例 1：本示例使用 fillRect() 方法创建矩形并填充默认颜色（黑色）。

    
        HTML canvas fillRect() Method
    


    
      
    
        var x = document.getElementById("GFG");
        var contex = x.getContext("2d");
        contex.fillRect(50, 50, 350, 200);
        contex.stroke();
     
  

输出：

示例 2：此示例使用 fillRect() 方法创建矩形并填充 ve 种颜色（绿色）。

    
        HTML canvas fillRect() Method
    


    
      
    
        var x = document.getElementById("GFG");
        var contex = x.getContext("2d");
        contex.fillStyle = "green";
        contex.fillRect(50, 50, 350, 200);
        contex.stroke();
     
  

输出：

支持的浏览器： fillRect()方法支持的浏览器如下：

• 谷歌浏览器
• 浏览器 9.0
• 火狐
• 苹果浏览器
• 歌剧