Thuộc tính height
Thuộc tính height xác định chiều cao của hình ảnh,
được định nghĩa bởi thẻ
img.
Hiện tại, thuộc tính này chỉ được phép
sử dụng cho hình ảnh
iframe,
video
và một số thẻ khác.
Cho phép chỉ định giá trị bằng pixel hoặc phần trăm. Trong trường hợp kích thước được xác định bằng phần trăm, giá trị đó sẽ được tính từ chiều rộng của phần tử cha. Trong trường hợp kích thước được xác định bằng pixel, đơn vị đo không cần chỉ định.
Nếu một hình ảnh không được xác định chiều rộng, cũng như chiều cao - hình ảnh sẽ có kích thước thực tế của nó. Nếu chiều cao được xác định - hình ảnh sẽ có chiều cao được chỉ định, còn chiều rộng sẽ tự điều chỉnh sao cho tỷ lệ của nó không bị bóp méo. Nếu chỉ chiều rộng được xác định - tương tự, hình ảnh sẽ tự điều chỉnh chiều cao để duy trì tỷ lệ. Nếu cả chiều rộng và chiều cao đều được xác định - tỷ lệ của hình ảnh có thể bị bóp méo (hoặc có thể không, tùy vào trường hợp). Nếu chiều rộng hoặc chiều cao (hoặc cả hai) lớn hơn kích thước thực - hình ảnh sẽ được phóng to, nhưng sẽ giảm chất lượng.
Khuyến nghị xác định chiều rộng và chiều cao cho hình ảnh trong các thuộc tính - trong trường hợp này, trình duyệt sẽ tải hình ảnh nhanh hơn - nó không cần phải tính toán kích thước của từng hình ảnh sau khi nhận được nó.
Không nên giảm kích thước thực tế
của hình ảnh một cách không cần thiết. Ví dụ, kích thước thực tế
của hình ảnh là 1000 x 1000
pixel, nhưng bạn lại đặt chiều rộng của nó là 100px.
Trong trường hợp này, hình ảnh trên màn hình sẽ hiển thị
với 100 pixel, nhưng lại có kích thước file
lên đến cả nghìn pixel và, tương ứng, sẽ tải lên
chậm hơn nhiều.
Xem các ví dụ thực tế tại đây:
thẻ img.
