in English

Launuka

Isar da ma'ana ta launi tare da ɗimbin azuzuwan amfanin launi. Ya haɗa da goyan baya don salon hanyoyin haɗin gwiwa tare da jahohin masu shaƙatawa, kuma.

Ma'amala da takamaiman

Wasu lokuta ba za a iya amfani da azuzuwan mahallin ba saboda keɓancewar wani zaɓi. A wasu lokuta, isasshiyar mafita ita ce haɗa abun cikin ku a <div>cikin aji.

Isar da ma'ana ga fasahar taimako

Yin amfani da launi don ƙara ma'ana kawai yana ba da alamar gani, wanda ba za a isar da shi ga masu amfani da fasahar taimako ba - kamar masu karanta allo. Tabbatar cewa bayanin da launi ke nunawa ko dai a bayyane yake daga abun cikin kanta (misali rubutun bayyane), ko kuma an haɗa shi ta hanyar madadin, kamar ƙarin rubutu da aka ɓoye tare da .sr-onlyajin.

Launi

.rubutu-primary

.rubutu-sakandare

.rubutu-nasara

.rubutu-haɗari

.rubutu-gargadi

.rubutu-bayanan

.rubutu-hasken

.rubutu-duhu

.rubutu-jiki

.rubutu-rufe

.rubutu-fararen fata

.rubutu-baki-50

.rubutu-fari-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>

Har ila yau, azuzuwan rubutu na yau da kullun suna aiki da kyau akan anka tare da samar da jujjuyawar da aka bayar da jihohin mayar da hankali. Lura cewa ajin ba shi .text-whiteda .text-mutedƙarin salo na hanyar haɗin da ya wuce layi.

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

Kalar bango

Mai kama da azuzuwan launi na mahallin mahallin, sauƙin saita bangon wani abu zuwa kowane aji na mahallin. Abubuwan anka za su yi duhu akan shawagi, kamar azuzuwan rubutu. Ba a saitacolor kayan aikin bayan fage , don haka a wasu lokuta kuna son amfani da .text-*abubuwan amfani.

.bg-firamare
.bg-sakandare
.bg-nasara
.bg-haɗari
.bg-gargadi
.bg-bayanai
.bg-haske
.bg-duhu
.bg-fari
.bg-m
<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>

Bayan fage

Lokacin $enable-gradientsda aka saita zuwa true(tsoho shine false), zaka iya amfani .bg-gradient-da azuzuwan mai amfani. Koyi game da zaɓuɓɓukanmu na Sass don kunna waɗannan azuzuwan da ƙari.

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