HTML <canvas> width egenskab

HTML <canvas> Tag

Definition og brug

width Egenskaben definerer <canvas>-elementets bredde i pixels.

advarsel

Brug height egenskab Angiv <canvas>-elementets højde i pixels.

Hver gang du sætter canvas' højde eller bredde til, vil indholdet på canvas blive ryddet (se eksemplet nederst på siden).

Besøg vores HTML Canvas vejledning Lær mere om <canvas>-elementet her.

Eksempel

Eksempel 1

En <canvas> element med højde og bredde på 200 pixels:

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

Prøv det selv

Eksempel 2

Ved at sætte width-egenskaben til 400px kan du rydde canvas (brug 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>

Prøv det selv

Syntaks

<canvas width="pixels">

Egenskabsværdi

Værdi Beskrivelse
pixels Definerer skærmens bredde i pixels (f.eks. “100”). Standardværdien er 300.

Browserunderstøttelse

Tallene i tabellen angiver den første browserversion, der fuldt ud understøtter egenskaben.

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

HTML <canvas> Tag