progress bars w Bootstrap (Buttons)

Pasek postępu – Bootstrap Progress bars

Czas czytania: < 1 minut

Paski postępu są ciekawymi dodatkami stron internetowych. Oczywiście nie występują one na każdej witrynie, ale i tak warto się z nimi zapoznać.

W Bootstrap istnieje kilka wzorów pasków postępu Progress bars.

Najprostszym przykładem paseka postępu jest:


70% Complete
70% Complete

Powyższy pasek postępu przedstawia wartość 70%. Pasek może również zawierać wpisaną wartość.

70% – lub inny tekst
60%

Domyślnie paski mogą zawierać kolory:

40% Complete (success)
20% Complete
60% Complete (warning)
80% Complete (danger)
40% Complete (success)
20% Complete
60% Complete (warning)
80% Complete (danger)

Lub wyglądać tak

40% Complete (success)
20% Complete
60% Complete (warning)
80% Complete (danger)
40% Complete (success)
20% Complete
60% Complete (warning)
80% Complete (danger)
35% Complete (success)
20% Complete (warning)
10% Complete (danger)
35% Complete (success)
20% Complete (warning)
10% Complete (danger)

Powyższe paski są standardowe, na ich podstawie możemy sami tworzyć nowe wedle własnego uznania.