
Подробное описание и демонстрация работы полосы прогресса под номером №1 для библиотеки Bootstrap. Html и CSS код для реализации progress bar’a на сайте как на изображении.
Демо Шкалы прогресса — стиль 1
<div class="container"> <div class="row"> <div class="col-sm-6"> <div class="progress"> <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 90%;"> <span class="sr-only">90%</span> </div> </div> </div> </div> </div>css разметка для реализации полосы прогресса
.progress{ border-radius: 0; height:35px; line-height: 35px; box-shadow: none; } .progress .progress-bar{ background-color:#ae1010; } .progress-bar .sr-only{ color: #060606; font-size: 15px; font-weight: bold; position: relative; right: -56%; top: 9px; }