Örnek
Anında, kırmızı kare çizin ve içine göstermek <canvas> elemanı:
<canvas id="myCanvas"></canvas>
<script>
var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
ctx.fillStyle = "#FF0000";
ctx.fillRect(0, 0, 80, 80);
</script>
Kendin dene " Tanımı ve Kullanımı
<canvas> etiketi komut dosyası aracılığıyla anında, grafik çizmek için kullanılır (usually JavaScript) .
<canvas> etiketi yalnızca grafikler için, aslında grafik çizmek için bir komut dosyası kullanmalısınız bir kaptır.
Tarayıcı Desteği
Tablodaki rakamlar tamamen elemanı destekleyen ilk tarayıcı sürümü belirtin.
| Eleman | |||||
|---|---|---|---|---|---|
| <canvas> | 4.0 | 9.0 | 2.0 | 3.1 | 9.0 |
HTML 4.01 ve HTML5 Arasındaki Farklar
<canvas> etiketi HTML5 getirdiği bir yeniliktir.
İpuçları ve Notlar
Note: iç herhangi bir metin <canvas> elemanı desteklemediği tarayıcılarda görüntülenir <canvas> .
Tip: hakkında daha fazla bilgi <canvas> bizim de eleman HTML Tuval Eğitimi .
Tip: tuval nesnesi ile kullanılabilir tüm özellikleri ve yöntemleri tam bir referans için lütfen gidin HTML Tuval Referans .
Nitelikler
= HTML5'teki Yeni.
| nitelik | değer | Açıklama |
|---|---|---|
| height | pixels | tuvalin yüksekliğini belirtir |
| width | pixels | tuval genişliğini belirtir |
Küresel Nitelikler
<canvas> etiketi de destekliyor Küresel HTML Özellikleri .
Olay Nitelikler
<canvas> etiketi de destekler Olay HTML Özellikleri .
Varsayılan CSS Ayarları
Yok.