Warna-warna
Nepikeun harti ngaliwatan warna jeung sakeupeul kelas utiliti warna. Ngawengku rojongan pikeun styling Tumbu kalawan kaayaan hover, teuing.
.téks-primér
.téks-sekundér
.teks-sukses
.téks-bahaya
.téks-warning
.téks-inpo
.téks-lampu
.téks-poék
.téks-muted
.téks-bodas
<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-muted">.text-muted</p>
<p class="text-white bg-dark">.text-white</p>
Kelas téks kontekstual ogé tiasa dianggo dina jangkar kalayan kaayaan hover sareng fokus anu disayogikeun. Catet yén kelas .text-white
na .text-muted
teu boga styling link.
<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>
Sarupa jeung kelas warna téks kontekstual, gampang nyetel latar tukang unsur pikeun sagala kelas kontekstual. Komponén jangkar bakal poék dina hover, sapertos kelas téks. Utiliti latar henteu disetelcolor
, janten dina sababaraha kasus anjeun hoyong nganggo .text-*
utilitas.
<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>
Nalika $enable-gradients
disetel ka leres, anjeun tiasa nganggo .bg-gradient-
kelas utiliti. Sacara standar, $enable-gradients
ditumpurkeun sareng conto di handap ieu ngahaja rusak. Hal ieu dilakukeun pikeun kustomisasi gampang ti mimiti anjeun nganggo Bootstrap. Diajar ngeunaan pilihan Sass kami pikeun ngaktipkeun kelas ieu sareng seueur deui.
<div class="p-3 mb-2 bg-gradient-primary text-white">.bg-gradient-primary</div>
<div class="p-3 mb-2 bg-gradient-secondary text-white">.bg-gradient-secondary</div>
<div class="p-3 mb-2 bg-gradient-success text-white">.bg-gradient-success</div>
<div class="p-3 mb-2 bg-gradient-danger text-white">.bg-gradient-danger</div>
<div class="p-3 mb-2 bg-gradient-warning text-dark">.bg-gradient-warning</div>
<div class="p-3 mb-2 bg-gradient-info text-white">.bg-gradient-info</div>
<div class="p-3 mb-2 bg-gradient-light text-dark">.bg-gradient-light</div>
<div class="p-3 mb-2 bg-gradient-dark text-white">.bg-gradient-dark</div>
Ngungkulan spésifisitas
Kadang-kadang kelas kontekstual teu tiasa diterapkeun kusabab spésifisitas pamilih anu sanés. Dina sababaraha kasus, hiji workaround cukup pikeun mungkus eusi unsur anjeun dina <div>
kalawan kelas.
Nepikeun harti kana téknologi anu ngabantosan
Ngagunakeun warna pikeun nambahkeun harti ngan nyadiakeun indikasi visual, nu moal conveyed ka pamaké tina téhnologi mantuan - kayaning pamiarsa layar. Pastikeun yén inpormasi anu dilambangkeun ku warna écés tina eusina sorangan (contona téks anu katingali), atanapi kalebet dina cara alternatif, sapertos téks tambahan disumputkeun sareng .sr-only
kelas.