Manual de referência HTML

大全 de etiquetas HTML

Atributo width do HTML canvas

A propriedade width especifica a largura do elemento <canvas> em pixels, usando a propriedade width para especificar a largura do elemento <canvas> em pixels.

HTML <canvas> tag

Exemplo online

Altura e largura de2elemento <canvas> de 00 pixels:

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>
<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 a propriedade width.

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

Definição e uso

A propriedade width especifica a largura do elemento <canvas> em pixels.

Dica: Use a propriedade width para especificar a largura do elemento <canvas> em pixels.

Dica: O conteúdo do canvas é apagado sempre que a altura ou largura do canvas for redefinida (veja o exemplo no final da página).

Dica: Por favor, visite nossa HTML Canvas Aprenda mais sobre <canvas> no nosso tutorial HTML.

HTML 4.01 com HTML 5 diferenças

<canvas> é uma tag HTML5 contém a nova tag.

Sintaxe

<canvas width="pixels">

Valor da propriedade

Valor	Descrição
pixels	Especifique o atributo width do canvas, em pixels (por exemplo":100) O valor padrão de width é "300"

Mais exemplos

Para limpar o canvas, configure a propriedade 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>/button>
</body>
</html>

Teste e veja ‹/›

HTML <canvas> tag

HTML: <template> tag