in English

Langi za langi

Tuusa amakulu ng’oyita mu langi n’engalo ntono eza kiraasi z’omugaso gwa langi. Mulimu obuwagizi bw'okukola sitayiro enkolagana n'embeera za hover, era.

Okukola ku nsonga ezitali zimu

Oluusi ebika by’embeera (contextual classes) tebisobola kukozesebwa olw’obutonde obw’enjawulo obw’omusunsuzi omulala. Mu mbeera ezimu, eky’okukola ekimala kwe kuzinga ebirimu mu elementi yo mu a <div>ne kiraasi.

Okutuusa amakulu mu tekinologiya ayamba

Okukozesa langi okwongera amakulu kiwa ekiraga ekirabika kyokka, ekitajja kutuusibwa eri abakozesa tekinologiya ayamba – gamba ng’ebisoma ku ssirini. Kakasa nti amawulire agalagirwa langi oba geeyoleka okuva mu birimu byennyini (okugeza ekiwandiiko ekirabika), oba gateekebwamu okuyita mu ngeri endala, gamba ng’ebiwandiiko ebirala ebikwekebwa ne .sr-onlykiraasi.

Langi

.ekiwandiiko-ekisookerwako

.ekiwandiiko-ekyokubiri

.ekiwandiiko-obuwanguzi

.ekiwandiiko-akabi

.ekiwandiiko-okulabula

.ekiwandiiko-amawulire

.ekiwandiiko-ekitangaala

.ekiwandiiko-ekizikiza

.ekiwandiiko-omubiri

.ekiwandiiko-ekisirise

.ekiwandiiko-enjeru

.ekiwandiiko-ekiddugavu-50

.ekiwandiiko-enjeru-50

<p class="text-primary">.text-primary</p>
<p class="text-secondary">.text-secondary</p>
<p class="text-success">.text-success</p>
<p class="text-danger">.text-danger</p>
<p class="text-warning">.text-warning</p>
<p class="text-info">.text-info</p>
<p class="text-light bg-dark">.text-light</p>
<p class="text-dark">.text-dark</p>
<p class="text-body">.text-body</p>
<p class="text-muted">.text-muted</p>
<p class="text-white bg-dark">.text-white</p>
<p class="text-black-50">.text-black-50</p>
<p class="text-white-50 bg-dark">.text-white-50</p>

Ebika by’ebiwandiiko eby’embeera nabyo bikola bulungi ku nnanga n’embeera eziweereddwa hover ne focus. Weetegereze nti .text-whitene .text-mutedclass terina link styling ya kwongerako okusukka underline.

<p><a href="#" class="text-primary">Primary link</a></p>
<p><a href="#" class="text-secondary">Secondary link</a></p>
<p><a href="#" class="text-success">Success link</a></p>
<p><a href="#" class="text-danger">Danger link</a></p>
<p><a href="#" class="text-warning">Warning link</a></p>
<p><a href="#" class="text-info">Info link</a></p>
<p><a href="#" class="text-light bg-dark">Light link</a></p>
<p><a href="#" class="text-dark">Dark link</a></p>
<p><a href="#" class="text-muted">Muted link</a></p>
<p><a href="#" class="text-white bg-dark">White link</a></p>

Langi y’emabega

Okufaananako ne kiraasi za langi z’ebiwandiiko eby’omutwe, kyangu okuteeka ennyuma y’ekintu ku kiraasi yonna ey’ensonga. Ebitundu bya anchor bijja kuzikizibwa ku hover, nga kiraasi z'ebiwandiiko. Background utilities teziteeka ,color kale mu mbeera ezimu ojja kwagala okukozesa .text-*utilities.

.bg-ekisookerwako
.bg-ekyokubiri
.bg-obuwanguzi
.bg-akabi
.bg-okulabula
.bg-amawulire
.bg-ekitangaala
.bg-ekizikiza
.bg-enjeru
.bg-obutangaavu
<div class="p-3 mb-2 bg-primary text-white">.bg-primary</div>
<div class="p-3 mb-2 bg-secondary text-white">.bg-secondary</div>
<div class="p-3 mb-2 bg-success text-white">.bg-success</div>
<div class="p-3 mb-2 bg-danger text-white">.bg-danger</div>
<div class="p-3 mb-2 bg-warning text-dark">.bg-warning</div>
<div class="p-3 mb-2 bg-info text-white">.bg-info</div>
<div class="p-3 mb-2 bg-light text-dark">.bg-light</div>
<div class="p-3 mb-2 bg-dark text-white">.bg-dark</div>
<div class="p-3 mb-2 bg-white text-dark">.bg-white</div>
<div class="p-3 mb-2 bg-transparent text-dark">.bg-transparent</div>

Okukyukakyuka okw’emabega

Bwe $enable-gradientskiteekebwa ku true(default is false), osobola okukozesa .bg-gradient-kiraasi z'ebikozesebwa. Manya ku Sass options zaffe okusobozesa classes zino n'ebirala.

  • .bg-gradient-primary
  • .bg-gradient-secondary
  • .bg-gradient-success
  • .bg-gradient-danger
  • .bg-gradient-warning
  • .bg-gradient-info
  • .bg-gradient-light
  • .bg-gradient-dark