Midabada
U gudbi macnaha midab leh sacab muggiis oo ah fasallada tamarta midabka. Waxa ku jira taageerada qaabaynta isku xidhka dawladaha duleelka leh, sidoo kale.
Wax ka qabashada gaar ahaaneed
Mararka qaarkood xiisadaha macnaha guud lama dabaqi karo sababtoo ah gaar ahaanshaha xulashada kale. Xaaladaha qaarkood, ka-hortag ku filan ayaa ah in lagu duubo nuxurka maaddooyinkaaga <div>fasalka.
U gudbinta macnaha tignoolajiyada caawinta
Isticmaalka midabka si loogu daro macnaha kaliya waxay bixisaa tilmaam muuqaal ah, taas oo aan loo gudbin doonin isticmaalayaasha tignoolajiyada caawinta - sida akhristayaasha shaashadda. Hubi in macluumaadka lagu tilmaamay midabku ay ka cad yihiin waxa ku jira laftiisa (tusaale qoraalka muuqda), ama lagu soo daro habab kale, sida qoraal dheeraad ah oo .sr-onlyfasalka dhexdiisa ku qarsoon.
Midabka
.Qoraalka-primary
.qoraalka-sare
.qoraal-guul
.Qoraalka-khatarta
.digniin qoraal ah
.macluumaadka qoraalka
.qoraalka-iftiin
.qoraal-madow
.qoraalka-jirka
.Qoraalka aamusan
.qoraal-cad
.qoraal-madow-50
.qoraal-cad-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>Fasallada qoraalka macnuhu waxa kale oo ay si fiican ugu shaqeeyaan barroosinnada leh duleelka la bixiyay iyo xaaladaha diiradda la saaray. Ogsoonow in fasalka .text-whiteiyo .text-mutedfasalka aysan lahayn habayn dheeri ah oo ka baxsan hoosta.
<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>midabka asalka
Si la mid ah fasallada midabka qoraalka ee macnaha guud, si fudud u deji asalka curiyaha fasalka kasta. Qaybaha barroosinku waxay ku madoobayaan duleelka, sida fasallada qoraalka. Utility -ga asalka ahi ma dejiyocolor , markaa xaaladaha qaarkood waxaad u baahan doontaa inaad isticmaasho .text-*yutiilitida.
<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>Dabaqa hoose
Marka $enable-gradientslagu dhigo true(default is false), waxaad isticmaali kartaa .bg-gradient-fasalada utility. Wax ka baro fursadahayada Sass si aan awood ugu siinno fasaladan iyo wax ka badan.
.bg-gradient-primary.bg-gradient-secondary.bg-gradient-success.bg-gradient-danger.bg-gradient-warning.bg-gradient-info.bg-gradient-light.bg-gradient-dark