Thẻ HTML

Thứ năm - 31/08/2023 23:43

Định nghĩa và cách sử dụng thẻ <progress>

Thẻ <progress> thể hiện tiến độ hoàn thành của một nhiệm vụ. Ví dụ sau hiển thị thanh tiến trình:

<label for="file">Downloading progress:</label>
<progress id="file" value="32" max="100"> 32% </progress>

Mẹo:

  • Luôn thêm thẻ <label> để có các phương pháp trợ năng tốt nhất!
  • Sử dụng thẻ <progress> kết hợp với JavaScript để hiển thị tiến trình của một tác vụ.

Lưu ý: Thẻ <progress> không phù hợp để biểu thị thước đo (ví dụ: mức sử dụng dung lượng ổ đĩa hoặc mức độ liên quan của kết quả truy vấn). Để biểu thị một thước đo, thay vào đó hãy sử dụng thẻ <meter>.

Hỗ trợ trình duyệt

Các số trong bảng chỉ định phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ phần tử.

Phần tử
<progress>
Google Chrome MS Edge Firefox Safari Opera
8.0 10.0 16.0 6.0 11.0

Các thuộc tính

Thuộc tính Giá trị Mô tả
max number Chỉ định tổng số lượng công việc mà nhiệm vụ yêu cầu. Giá trị mặc định là 1
value number Chỉ định bao nhiêu nhiệm vụ đã được hoàn thành

Thuộc tính Global

Thẻ <progres> cũng hỗ trợ các thuộc tính Global trong HTML.

Thuộc tính sự kiện

Thẻ <progres> cũng hỗ trợ thuộc tính sự kiện trong HTML.

Cài đặt CSS mặc định

Tổng số điểm của bài viết là: 0 trong 0 đánh giá

  Ý kiến bạn đọc

Bạn đã không sử dụng Site, Bấm vào đây để duy trì trạng thái đăng nhập. Thời gian chờ: 60 giây