Balangi

Kopesa ndimbola na nzela ya langi na mwa ndambo ya bakelasi ya utilité ya langi. Esangisi lisungi mpo na kosala ba liens ya styling na ba états ya hover, mpe.

Kosala na ntina na makambo ya sikisiki

Tango mosusu ba classes contextuelles ekoki kosalelama te mpo na spécificité ya sélecteur mosusu. Na ba cas misusu, solution suffisante ezali ya ko envelopper contenus ya élément na yo na a <div>na classe.

Kopesa ndimbola na ba technologies ya kosunga

Kosalela langi mpo na kobakisa ndimbola epesaka kaka elembo ya komona, oyo ekopesama te na basaleli ya mayele ya kosunga – lokola batángi ya écran. Sala ete sango oyo elakisami na langi ezala polele uta na makambo yango moko (ndakisa makomi oyo ezali komonana), to ekotisama na nzela ya mayele mosusu, lokola makomi ya kobakisa oyo ebombami elongo na .sr-onlykelasi.

Langi

.mokanda-ya yambo

.texte-ya mibale

.elonga ya makomi

.makomi-likama

.kokebisa na makomi

.info ya makomi

.pole-pole ya makomi

.makomi-molili

.nzoto-ya-makomi

.ezali na mongongo ya makomi

.makomi-mpembe

.mokanda-moindo-50

.makomi-mpembe-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>

Ba classes ya texte contextuel esalaka pe bien na ba ancres na ba états ya hover na focus oyo epesami. Simbá ete kelasi ya .text-whitempe .text-mutedezali na styling ya lien ya kobakisa te oyo eleki kotya likebi.

Lien oyo ekangami na mongongo

Lien ya pembe

<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>

Color ya fond

Ndenge moko na ba classes ya couleur ya texte contextuel, tia facilement fond ya élément moko na classe contextuelle nionso. Ba composants ya anchor ekozala molili na hover, kaka lokola ba classes ya texte. Ba utilitaires ya fond etie tecolor , yango wana na ba cas misusu okolinga kosalela .text-*ba utilitaires.

.bg-ya yambo

.bg-ya mibale

.bg-kolonga

.bg-likámá

.bg-kebisi ya kokebisa

.bg-ya sango

.bg-pole na yango

.bg-molili ya molili

.bg-mondele ya pembe

.bg-ezali polele

<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>

Gradient ya fond

Tango $enable-gradientsetiamaki na true(default ezali false), okoki kosalela .bg-gradient-ba classes ya utilitaires. Yekola na ntina ya ba options na biso ya Sass mpo na ko activer ba classes oyo mpe mingi mosusu.

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