Атрибут height HTML тега <canvas>
Значение и применение
Атрибут height (HTML тега
<canvas>) определяет высоту элемента в единицах измерения CSS - пиксели.
Поддержка браузерами
Спецификация: multipage
Поддерживается во всех основных браузерах с 2015 года.
| Возможность | Компьютеры | Мобильные | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
 Chrome |  Edge |  Firefox |  Opera |  Safari | Chrome Android | Firefox for Android | Opera Android |  Safari on iOS |  Samsung Browser |  WebView Android | WebView on iOS | |
height | 1 | 12 | 1.5 Версия 1.5 выпущена в 2005 г. Примечание MDN (англ.) Before Firefox 5, the canvas width and height were signed integers instead of unsigned integers. Before Firefox 6, a <canvas> element with a zero width or height would be rendered as if it had default dimensions. Before Firefox 12, if JavaScript is disabled, the <canvas> element was being rendered instead of showing the fallback content as per the specification. Since then, the fallback content is rendered instead. | 9 | 2 Версия 2 выпущена в 2005 г. Примечание MDN (англ.) Although early versions of Apple's Safari browser don't require the closing tag, the specification indicates that it is required, so you should be sure to include it for broadest compatibility. Before version 2, Safari will render the content of the fallback in addition to the canvas itself unless you use CSS tricks to mask it. | 18 | 4 Версия 4 выпущена в 2011 г. Примечание MDN (англ.) Before Firefox for Android 5, the canvas width and height were signed integers instead of unsigned integers. Before Firefox for Android 6, a <canvas> element with a zero width or height would be rendered as if it had default dimensions. Before Firefox for Android 14, if JavaScript is disabled, the <canvas> element was being rendered instead of showing the fallback content as per the specification. Since then, the fallback content is rendered instead. | 10.1 | 1 | 1.0 | 37 | 1 |
поддерживаетсяс ограниченияминет поддержкинет данных≤31 — не позднее версии 31
Синтаксис:
<canvas height = "pixels">
Отличия HTML 4.01 от HTML 5
Атрибутheight был добавлен в HTML 5.
Значения атрибута
| Значение | Описание |
|---|---|
pixels |
Определяет высоту элемента в единицах измерения CSS - пиксели. Значение по умолчанию 150 пикселей. |
Атрибуты width/height задают размеры координатного пространства и исходного буфера;
CSS-размеры масштабируют результат. Изменение любого из этих атрибутов очищает рисунок и сбрасывает состояние
контекста даже при присваивании прежнего значения. Кроме 2D-контекста доступны WebGL и другие поддерживаемые
контексты. Предоставляйте текстовую альтернативу содержимому рисунка.
Примеры, попробуйте сами
Пример использования атрибутов height и width HTML тега <canvas>
Нажмите . Измените разметку во вкладке HTML и сравните результат.
index.html
<canvas id="canvas1" width="400" height="200"> Этот элемент не поддерживается. </canvas>
main.js
var g = document.getElementById('canvas1')
var ctx = g.getContext('2d')
var grd = ctx.createLinearGradient(0, 0, 380, 0)
grd.addColorStop(0, 'red')
grd.addColorStop(0.3, 'yellow')
grd.addColorStop(0.5, 'green')
grd.addColorStop(0.7, 'violet')
grd.addColorStop(1, 'blue')
ctx.fillStyle = grd
ctx.fillRect(10, 10, 380, 180)
Тони готовит пример…Нажмите , чтобы запустить пример.