Manual de referência do HTML

大全 do HTML

Atributo height do canvas HTML

O atributo height especifica a altura do elemento <canvas> em pixels. Cada vez que ajustar a altura ou largura do canvas, o conteúdo do canvas será limpo.

HTML <canvas> tag

Exemplo online

um elemento <canvas> com altura e largura de2elemento <canvas> de 00 pixels:

Exemplo

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Uso do atributo height do <canvas> HTML-基础教程(oldtoolbag.com)</title>
</head>
<body>
<canvas id="myCanvas" width="200" height="200" style="border:1px sólido">
Seu navegador não suporta o HTML5　canvas tag.
</canvas>
<script>
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.fillStyle = "#92B901";
ctx.fillRect(50,　50,　100,　100);
</script>
</body>
</html>

Teste e veja ‹/›

Compatibilidade do navegador

IEFirefoxOperaChromeSafari

Todos os navegadores populares suportam o atributo height.

Atenção: Internet Explorer 8 e versões mais antigas do Internet Explorer não suportam o tag <canvas>.

Definição e uso

O atributo height especifica a altura do elemento <canvas> em pixels.
Dica: Use o atributo width para especificar a largura do elemento <canvas> em pixels.

Dica: Cada vez que ajustar a altura ou largura do canvas, o conteúdo do canvas será limpo (veja o exemplo na parte inferior da página).

Dica: Acesse nosso Canvas HTML Aprenda mais sobre <canvas> no nosso tutorial HTML.

HTML 4.01 com HTML 5 diferenças

<canvas> 　é um elemento HTML5 novo marcador. O <canvas> é um elemento HTML

Sintaxe

<canvas height="pixels">

Valor do atributo

Valor	Descrição
pixels	Defina a altura do canvas em pixels (por exemplo "100px" ou simplesmente "100"). O padrão é "150".

Mais exemplos

Limpe o canvas ajustando o atributo width ou height (usando JavaScript):

Exemplo

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Uso do atributo width do <canvas> HTML-基础教程(oldtoolbag.com)</title>
</head>
<body>
<canvas id="myCanvas" width="200" height="200" style="border:1px sólido">
Seu navegador não suporta o HTML5　canvas tag.
</canvas>
<br>
<script>
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.fillStyle = "#92B901";
ctx.fillRect(50,　50,　100,　100);
function clearCanvas() {
　　c.height =　300;
}
</script>
<button onclick="clearCanvas()">Clear canvas</button>
</body>
</html>

Teste e veja ‹/›

HTML <canvas> tag

HTML: <template> tag