Saltar al contenido

barra de progreso bootstrap 4 con ejemplo de código de porcentaje

Al fin luego de mucho luchar ya dimos con la contestación de este inconveniente que algunos lectores de nuestro espacio han presentado. Si tienes algún dato que compartir no dejes de compartir tu comentario.

Ejemplo 1: barra de progreso de bootstrap

<divclass="progress"><divclass="progress-bar"role="progressbar"style="width:25%;"aria-valuenow="25"aria-valuemin="0"aria-valuemax="100">25%div>div>

Ejemplo 2: barra de progreso de bootstrap

<divclass="progress"><divclass="progress-bar w-75"role="progressbar"aria-valuenow="75"aria-valuemin="0"aria-valuemax="100">div>div><divclass="progress"><divclass="progress-bar"role="progressbar"style="width:25%"aria-valuenow="25"aria-valuemin="0"aria-valuemax="100">
      25%
   div>div><divclass="progress"style="height:1px"><divclass="progress-bar"role="progressbar"style="width:25%"aria-valuenow="25"aria-valuemin="0"aria-valuemax="100">div>div><divclass="progress"style="height:20px"><divclass="progress-bar"role="progressbar"style="width:25%"aria-valuenow="25"aria-valuemin="0"aria-valuemax="100">div>div><divclass="progress"><divclass="progress-bar bg-info"role="progressbar"style="width:50%"aria-valuenow="50"aria-valuemin="0"aria-valuemax="100">div>div><divclass="progress"><divclass="progress-bar"role="progressbar"style="width:15%"aria-valuenow="15"aria-valuemin="0"aria-valuemax="100">div><divclass="progress-bar bg-success"role="progressbar"style="width:30%"aria-valuenow="30"aria-valuemin="0"aria-valuemax="100">div><divclass="progress-bar bg-info"role="progressbar"style="width:20%"aria-valuenow="20"aria-valuemin="0"aria-valuemax="100">div>div><divclass="progress"><divclass="progress-bar progress-bar-striped bg-info"role="progressbar"style="width:50%"aria-valuenow="50"aria-valuemin="0"aria-valuemax="100">div>div><divclass="progress"><divclass="progress-bar progress-bar-striped progress-bar-animated"role="progressbar"aria-valuenow="75"aria-valuemin="0"aria-valuemax="100"style="width:75%">div>div>

Sección de Reseñas y Valoraciones

Tienes la posibilidad recomendar este tutorial si te fue de ayuda.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

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