HTML <canvas> girmen width

Farin kai da amfani

Girmen width Girmen kashi da yake da kanawa da kan <canvas> takarda, a kan pixel.

Barka

Gami: Girmen height Tura kashi da yake da kanawa a kan <canvas> takarda, a kan pixel.

Kada a yi kammala kashi da yake da kanawa ko kashi da yake, yarawar kanawa za a kaiya (kai kamawa shi kuma koyarwar shi a yankin tsaki na shafin).

Tura hancin HTML Canvas Tutorial Tuta bai bayanin <canvas> takarda. Koyarwa kan

Shiyya

Masanin 1

Biki da kashi da yake 200 pixel kan <canvas> takarda:

<canvas id="myCanvas" width="400" height="400" style="border:1px solid">

Try It Yourself

Masanin 2

Ta girmen nafin kaiyawa aiki da kuma fura kanawa (gami JavaScript):

<canvas id="myCanvas" width="200" height="200" style="border:1px solid"></canvas>
<script>
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.fillStyle = "#0192B9";
ctx.fillRect(50, 50, 300, 300);
function clearCanvas() {
  c.width = 400;
}
</script>

Try It Yourself

Syntax

<canvas width="pixels">

Attribute Value

Value Description
pixels Specifies the width of the canvas in pixels (e.g., “100”); the default value is 300.

Browser Support

The numbers in the table indicate the first browser version to fully support this attribute.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 2.0 3.1 9.0