HTML canvas Etiketi

<canvas> Etiketi

Örnek

canvas etiketleri arasına mavi bir kare çizimi:

<canvas id="myCanvas"></canvas>

<script>
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.fillStyle = "#3059D6";
ctx.fillRect(0, 0, 80, 100);
</script>

<canvas> Tanımı ve Kullanımı

<canvas> etiketi genellikle JavaScript ile komut dizisi oluşturma yoluyla grafikler çizmek için kullanılır.

<canvas> elementinin kendi başına çizim özelliği yoktur. Canvas, grafikler için sadece taşıyıcı görevi görür. Grafikleri çizebilmek için bir komut dili kullanmalısınız. (JavaScript gibi)


Tarayıcı Desteği

Tablodaki sayılar canvas elementini tamamen destekleyen ilk tarayıcı versiyonunu ifade ediyor.

Element
<canvas> 4.012.0 9.0 2.0 3.1 9.0

HTML 4.01 ile HTML5 arasındaki farklar

<canvas> etiketi HTML5'te yenidir.


İpuçları ve Notlar

Not: <canvas> etiketleri arasındaki yazı, canvas elementini desteklemeyen tarayıcılarda görünür.

İpucu: Canvas nesnesiyle birlikte kullanılabilen tüm özellikleri ve metodları incelemek için HTML Canvas Referans sayfamızı ziyaret edebilirsiniz.


Özellikler

= HTML5'te yeni.
Özellik Değer Tanım
height piksel Canvas yüksekliğini belirler
width piksel Canvas genişliğini belirler

Standart Özellikler

<canvas> etiketi Standart Özellikleri desteklemektedir.

HTML Standart Özellikler'i inceleyebilirsiniz.


Olay Özellikleri

<canvas> etiketi Olay Özelliklerini desteklemektedir.

HTML Olay Özellikleri'ni inceleyebilirsiniz.

Yorumlar

Bu blogdaki popüler yayınlar

HTML progress Etiketi

CSS content Özelliği

HTML section Etiketi

CSS transition-delay Özelliği

CSS align-items özelliği

CSS text-justify Özelliği

CSS justify-content Özelliği

HTML5 Canvas Oyun Yapımı Dersleri

CSS overflow Özelliği

CSS top Özelliği