Mihlovo
Humesa nhlamuselo hi ku tirhisa mihlovo hi voko ra titlilasi ta vukorhokeri bya mihlovo. Ku katsa na nseketelo wa switayili swa swihlanganisi na swiyimo swa hover, na swona.
Ku tirhana ni ku kongoma
Minkarhi yin’wana titlilasi ta xiyimo a ti nge tirhisiwi hikwalaho ka ku kongoma ka muhlawuri un’wana. Eka swiyimo swin’wana, ndlela leyi eneleke yo tshungula i ku phutsela nhundzu ya elemente ya wena hi a <div>
na tlilasi.
Ku hundzisela nhlamuselo eka thekinoloji yo pfuneta
Ku tirhisa muvala ku engetela nhlamuselo swi nyika ntsena xikombiso xa xivono, lexi nga ta ka xi nga hundziseriwi eka vatirhisi va thekinoloji yo pfuneta – ku fana na swihlaya swa xikirini. Tiyisisa leswaku mahungu lama kombisiweke hi muvala ya le rivaleni eka nhundzu hi yoxe (xikombiso tsalwa leri vonakaka), kumbe ya katsiwile hi tindlela tin’wana, ku fana na tsalwa ro engetela leri fihliweke na .sr-only
tlilasi.
Muhlovo
.tsalwa-xitsongwatsongwana
.tsalwa-xikondari
.ku humelela ka tsalwa
.khombo ra tsalwa
.xitsundzuxo xa tsalwa
.vuxokoxoko bya tsalwa
.tsalwa-ku vonakala
.tsalwa-munyama
.tsalwa-miri
.ku pfariwa hi tsalwa
.tsalwa-wo basa
.tsalwa-ntima-50
.tsalwa-xo basa-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>
Titlilasi ta matsalwa ya mongo na tona ti tirha kahle eka ti-anchor leti nga na swiyimo swa hover na focus leswi nyikiweke. Xiya leswaku tlilasi ya .text-white
na .text-muted
a yi na xitayili xa xihlanganisi xo engetela ku tlula ku thalela ehansi.
<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>
Muhlovo wa le ndzhaku
Ku fana na titlilasi ta mihlovo ya tsalwa ra mongo, veka hi ku olova ndzhaku ka elemente eka tlilasi yihi na yihi ya mongo. Swiphemu swa anchor swi ta va munyama eka hover, ku fana na titlilasi ta matsalwa. Background utilities do not setcolor
, kutani eka swiyimo swin’wana u ta lava ku tirhisa .text-*
switirhisiwa.
<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>
Xirhendzevutani xa le ndzhaku
Loko $enable-gradients
yi vekiwile eka true
(default is false
), u nga tirhisa .bg-gradient-
titlilasi ta vukorhokeri. Dyondza hi tindlela ta hina ta Sass ku endla leswaku titlilasi leti ti tirha na swin’wana.
.bg-gradient-primary
.bg-gradient-secondary
.bg-gradient-success
.bg-gradient-danger
.bg-gradient-warning
.bg-gradient-info
.bg-gradient-light
.bg-gradient-dark