Thuộc tính height của HTML <canvas>

Thẻ <canvas> HTML

Định nghĩa và cách sử dụng

height Thuộc tính quy định chiều cao của đối tượng <canvas> bằng đơn vị pixel.

Hướng dẫn

Vui lòng sử dụng Thuộc tính width Định nghĩa chiều rộng của đối tượng <canvas> bằng đơn vị pixel.

Mỗi khi thiết lập lại chiều cao hoặc chiều rộng của bề mặt vẽ, nội dung của bề mặt vẽ sẽ bị xóa bỏ (xin xem ví dụ ở cuối trang).

Vui lòng tham khảo Hướng dẫn HTML Canvas Học thêm về đối tượng <canvas>.

Mô hình

Ví dụ 1

Đối tượng <canvas> có chiều cao và chiều rộng đều là 200 pixel:

<canvas id="myCanvas" width="400" height="400" style="border:1px solid">

Thử ngay

Ví dụ 2

Bằng cách thiết lập thuộc tính chiều cao thành 300px để xóa bỏ bề mặt vẽ (sử dụng JavaScript):

<canvas id="myCanvas" width="400" height="400" style="border:1px solid"></canvas>
<script>
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.fillStyle = "#0192B9";
ctx.fillRect(50, 50, 300, 300);
function clearCanvas() {
  c.height = 400;
}
</script>

Thử ngay

Cú pháp

<canvas height="pixels">

Giá trị thuộc tính

Giá trị Mô tả
pixels Định nghĩa chiều cao của canvas bằng pixel (ví dụ như “100”). Giá trị mặc định là 150.

Hỗ trợ trình duyệt

Số trong bảng chỉ ra phiên bản trình duyệt đầu tiên hỗ trợ thuộc tính này hoàn toàn.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 2.0 3.1 9.0

Thẻ <canvas> HTML