Przykład
<canvas> elementu o height i width 200 pikseli:
<canvas id="myCanvas" width="200" height="200" style="border:1px solid">
Spróbuj sam " Więcej "Try it yourself" przykłady poniżej.
Definicja i Wykorzystanie
width atrybut określa szerokość <canvas> elementu w pikselach.
Wskazówka: Użyj height atrybut, aby określić wysokość <canvas> elementu w pikselach.
Wskazówka: Za każdym razem, wysokość lub szerokość płótna ponownie ustawić zawartość płótno zostaną usunięte (patrz przykład na dole strony).
Wskazówka: Więcej informacji na temat <canvas> elementu w naszym HTML Canvas Tutorial .
Pomoc Browser
Liczby w tabeli określ pierwszą wersję przeglądarki, która w pełni obsługuje atrybut.
| Atrybut | |||||
|---|---|---|---|---|---|
| width | 4,0 | 9,0 | 2,0 | 3,1 | 9,0 |
Różnice między HTML 4.01 i HTML5
<canvas> tag nowego w HTML5.
Składnia
<canvas width="pixels">
wartości atrybutów
| Wartość | Opis |
|---|---|
| pixels | Określa szerokość płótna w pikselach (np "100"). Domyślna szerokość to "300" |
Więcej przykładów
Przykład
Usunąć płótna ustawiając width lub height atrybut (przy użyciu 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 = "#92B901";
ctx.fillRect(50, 50,
100, 100);
function clearCanvas() {
c.height =
300;
}
</script> Spróbuj sam "