Thẻ <canvas> trong HTML5

Thẻ `<canvas>` trong HTML5

Tag <canvas> được dùng để hiển thị đồ họa.
Tag <canvas> sử dụng như vùng chứa đồ họa, việc vẽ đồ họa sẽ do script thực hiện.

HTML4.01	HTML5
● Không hỗ trợ	● Đây là tag mới trong HTML5

<canvas></canvas>

Dòng text nằm giữa <canvas> và </canvas> sẽ hiển thị khi trình duyệt không hỗ trợ tag <canvas>

Ví dụ

<canvas id="canvasId">Trình duyệt của bạn không hỗ trợ tag canvas</canvas>
<script>
...Code vẽ...
</script>

Yêu cầu phiên bản trình duyệt với mức tối thiểu được hỗ trợ cho thẻ <canvas>:

Trình duyệt dành cho PC:

39image-47

Tag <canvas> được hỗ trợ trong đa số các trình duyệt, ngoại trừ IE8 trở xuống.

Yêu cầu phiên bản hệ điều hành và trình duyệt với mức tối thiểu được hỗ trợ cho thẻ <canvas>:

ĐIỆN THOẠI (SMARTPHONE)

Hệ điều hành

39image-2

Trình duyệt

39image-3

MÁY TÍNH BẢNG (TABLETS)

Hệ điều hành

39image-4

Trình duyệt

39image-5

Cách sử dụng:

<canvas thuoctinh="giatri"></canvas>

Thuộc tính tùy chọn

Thuộc tính	Giá trị	Ví dụ	Mô tả
height	pixel	height="50px"	Xác định chiều cao của canvas.
width	pixel	width="100px"	Xác định chiều rộng của canvas.

Thẻ này hỗ trợ tất cả các thuộc tính Global được miêu tả trong chương: Tổng hợp thuộc tính trong HTML

Thẻ này hỗ trợ tất cả các thuộc tính sự kiện được miêu tả trong chương: Tổng hợp sự kiện (Event) trong HTML