Thẻ meter trong HTML
- 17-12-2021
- Trung Minh
- 0 Comments
Thẻ meter xác định một phép đo vô hướng trong phạm vi đã biết, hoặc biểu diễn một phân số dưới dạng một thước đo.
Thẻ meter không xử dụng để biểu diễn quá trình diễn ra( ví dụ số % đã tải) mà nó biểu diễn giá trị cố định, không thay đổi trong một thời gian ngắn. Nếu muốn thể hiện quá trình diễn ra, bạn nên sử dụng thẻ progress.
Khi nào nên sử dụng thẻ meter? Khi bạn muốn biểu diễn một giá trị phân số, giá trị % nào đó ví dụ như dung lượng đã sử dụng của ổ đĩa/dung lương ổ đĩa, số điểm/số điểm tối đa.v.v..
Cách sử dụng
Ví dụ: Sử dụng thẻ meter để giới thiệu về các kỹ năng của bạn trong CV xin việc.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<main>
<h2>Kỹ Năng</h2>
<div>
<label>PHP: </label>
<meter value="8" min="0" max="10">2 out of 10</meter>
<br>
<label>HTML/CSS: </label>
<meter value="0.6">60%</meter>
<br>
<label>JS/JQUERY: </label>
<meter value="0.5">60%</meter>
<br>
<label>ENGLISH: </label>
<meter value="0.9">60%</meter>
</div>
</main>
<footer>
freetuts.net
</footer>
</body>
</html>
Biểu diễn bằng thẻ meter thay cho những con số bình thường khiến trang trở nên sống động hơn rất nhiều phải không nào.