خصوصیت 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 |