in English

Amabara

Tanga ibisobanuro ukoresheje ibara hamwe nintoki zamabara yingirakamaro. Harimo inkunga ya styling ihuza hamwe na leta ya hover, nayo.

Gukemura ibibazo byihariye

Rimwe na rimwe, ibyiciro byihariye ntibishobora gukoreshwa kubera umwihariko wundi watoranije. Rimwe na rimwe, akazi gahagije ni ugupfunyika ibintu byawe muri <div>hamwe nishuri.

Gutanga ibisobanuro kubuhanga bufasha

Gukoresha ibara kugirango wongere ibisobanuro bitanga gusa icyerekezo cyerekana, kitazashyikirizwa abakoresha tekinoroji ifasha - nk'abasoma ecran. Menya neza ko amakuru yerekanwe n'ibara agaragara uhereye kubirimo ubwabyo (urugero: inyandiko igaragara), cyangwa bigashyirwa muburyo butandukanye, nk'inyandiko y'inyongera ihishe hamwe .sr-onlyn'ishuri.

Ibara

.text-primaire

.text-yisumbuye

.text-intsinzi

.text-akaga

.text-imburira

.text-amakuru

.umucyo

.text-umwijima

.text-umubiri

.text

.text-yera

.text-umukara-50

.text-yera-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>

Amasomo yinyandiko asobanura nayo akora neza kuri ankeri hamwe na hover yatanzwe hamwe na leta yibanze. Menya ko i .text-whitena .text-mutedclass nta yandi mahuza yongeyeho kurenza umurongo.

Ihuza ryibanze

Ihuza rya kabiri

Ihuza

Ihuza ry'akaga

Ihuza ryo kuburira

Ihuza ry'amakuru

Ihuza ryumucyo

Ihuza ryijimye

Guhuza

Ihuza ryera

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

Ibara ry'inyuma

Bisa nibisobanuro byanditseho ibara ryamasomo, byoroshye gushiraho inyuma yibintu kurwego urwo arirwo rwose. Ibice bya Anchor bizijimye kuri hover, kimwe namasomo yinyandiko. Ibikorwa byinyuma ntibishirahocolor , mubihe bimwe rero uzakenera gukoresha .text-*ibikorwa byingirakamaro.

.bg-ibanze
.bg-kabiri
.bg-intsinzi
.bg-akaga
.bg-kuburira
.bg-amakuru
.bg-urumuri
.bg-umwijima
.bg-cyera
.bg-mucyo 
<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>

Icyiciro cya mbere

Iyo $enable-gradientsyashizwe kuri true(isanzwe ni false), urashobora gukoresha .bg-gradient-amasomo yingirakamaro. Wige kubyerekeye amahitamo ya Sass kugirango ushoboze aya masomo nibindi byinshi.

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