Пример
Элемент <canvas> высотой и шириной 200 пикселей:
<canvas id="myCanvas" width="200" height="200" style="border:1px solid">
Попробуйте сами »
Другие примеры "Попробуйте сами" ниже.
Определение и использование
Атрибут width задаёт ширину элемента
<canvas> в пикселях.
Совет: Используйте атрибут height
чтобы задать высоту элемента
<canvas> в пикселях.
Совет: Каждый раз при изменении высоты или ширины холста, его содержимое будет очищаться (см. пример внизу страницы).
Совет: Узнайте больше об элементе
<canvas> в нашем
HTML Canvas Tutorial.
Поддержка браузерами
Числа в таблице указывают первую версию браузера, полностью поддерживающую атрибут.
| Атрибут | |||||
|---|---|---|---|---|---|
| width | 4.0 | 9.0 | 2.0 | 3.1 | 9.0 |
Синтаксис
<canvas width="пиксели">
Значения атрибута
| Значение | Описание |
|---|---|
| пиксели | Задает ширину холста в пикселях (например "100"). Значение по умолчанию: 300 |
Дополнительные примеры
Пример
Очистка холста установкой атрибута width в 400px (с использованием JavaScript):
<canvas id="myCanvas" width="200" height="200" style="border:1px solid"></canvas>
<script>
let c = document.getElementById("myCanvas");
let ctx = c.getContext("2d");
ctx.fillStyle = "#92B901";
ctx.fillRect(50, 50, 100, 100);
function clearCanvas() {
c.width =
400;
}
</script>
Попробуйте сами »