خصوصیت width HTML <canvas>

تعریف و استفاده

عرض خصوصیت width تعیین می‌کند عرض عنصر <canvas> را به صورت پیکسلی.

توضیحات

لطفاً از خصوصیت height ارتفاع عنصر <canvas> را به صورت پیکسلی مشخص کنید.

در هر بار که ارتفاع یا عرض صفحه‌نمایی تنظیم می‌شود، محتوای صفحه‌نمایی پاک می‌شود (لطفاً به مثال در پایین صفحه مراجعه کنید).

لطفاً در آموزش HTML Canvas برای یادگیری بیشتر در مورد عنصر <canvas> به دوره‌های ما مراجعه کنید.

مثال

مثال 1

عنصر <canvas> با عرض و ارتفاع 200 پیکسل:

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

آزمایش کنید

مثال 2

با تنظیم مقیاس عرض به 400px، صفحه‌نمایی را پاک کنید (از 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>

آزمایش کنید

قوانین

<canvas width="pixels">

مقدار ویژگی

مقدار توضیح
pixels طول صفحه‌نما را به صورت پیکسل مشخص کنید (مثلاً “100”). مقدار پیش‌فرض 300 است.

پشتیبانی مرورگر

اعداد در جدول نشان‌دهنده نسخه اولیه مرورگرهایی است که از این ویژگی پشتیبانی می‌کنند.

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