Html5 nos permite crear fantásticas barras de progreso, en conjunto con Javascript se pueden crear barras dinámicas, por ejemplo para mostrar el avance de una tarea, un proceso, una medida o cualquier cosa que pueda ser representada mediante el elemento html que hoy aprenderemos.

Barras de progreso

Con la etiqueta <progress> podemos crear una barra de progreso.

<progress>…</progress>

Atributos para <progress>

  • Min: su valor será el valor mínimo de la barra de progreso.
  • Max: su valor será el valor máximo de la barra de progreso.
  • Value: su valor será un valor entre el valor mínimo y el valor máximo y se reflejara en la barra de progreso.

Ejemplo:

<progress min="0" max="100" value="75">este es un elemento de progreso no soportado por tu navegador, prueba con otro </progress>

Para crear una barra de progreso dinámico, que obedezca a eventos se requiere conocimientos de programación en javascript.

Lecciones de HTML5
4.3/5 - (15 votos)
Te recomendamos leer:  Rectángulos en svg HTML5

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *