SourceOkukulakulana
Ebiwandiiko n'ebyokulabirako by'okukozesa Bootstrap custom progress bars ezirimu obuwagizi ku bbaala ezitumbiddwa, ebifaananyi ebirina obulamu, n'ebiwandiiko ebiwandiikiddwa.
Ebitundu by’enkulaakulana bizimbibwa n’ebintu bibiri ebya HTML, ebimu CSS okuteeka obugazi, n’ebintu ebitonotono. Tetukozesa elementi ya HTML5<progress>
, okukakasa nti osobola okuteeka ebbaala z’enkulaakulana, okuzifuula obulamu, n’okuziteekako obubonero bw’ebiwandiiko.
- Tukozesa the
.progress
nga wrapper okulaga max value ya progress bar.
- Tukozesa eby’omunda
.progress-bar
okulaga enkulaakulana okutuuka wano.
- The
.progress-bar
yeetaaga sitayiro ya mu layini, ekibiina ky'omugaso, oba CSS eya bulijjo okuteeka obugazi bwazo.
- The
.progress-bar
era yeetaaga ebimu role
n’ebintu aria
okugifuula etuukirirwa.
Ebyo byonna biteeke wamu, era olina ebyokulabirako bino wammanga.
Bootstrap egaba ebikozesebwa ebitonotono eby'okuteekawo obugazi . Okusinziira ku byetaago byo, bino biyinza okuyamba mu kutegeka amangu enkulaakulana.
Ebiwandiiko ebiwandiikibwako
Yongera ebiwandiiko ku bbaala zo ez'enkulaakulana ng'oteeka ebiwandiiko munda mu .progress-bar
.
Tuteeka height
omuwendo gwokka ku .progress
, kale bw’okyusa omuwendo ogwo ogw’omunda .progress-bar
gujja kukyusa obunene bw’omuntu okusinziira ku ekyo.
Kozesa kiraasi z’ebikozesebwa eby’emabega okukyusa endabika y’embaawo z’enkulaakulana ssekinnoomu.
Teekamu ebbaala z’enkulaakulana eziwera mu kitundu ky’enkulaakulana bw’oba weetaaga.
Okwongera .progress-bar-striped
ku kyonna .progress-bar
okusiiga omuguwa ng'oyita mu CSS gradient ku langi y'emabega y'ebbaala y'enkulaakulana.
Gradient eriko emisono nayo esobola okubeera ey’obulamu. Okwongerako .progress-bar-animated
ku .progress-bar
okusobola okukola emisono obulamu okuva ku ddyo okudda ku kkono nga oyita mu CSS3 animations.