Reňkler
Birnäçe reňk peýdaly sapaklary bilen reňk arkaly many beriň. Hover ştatlary bilen baglanyşyklary düzmek üçin goldawy hem öz içine alýar.
Aýratynlyk bilen iş salyşmak
Käwagt başga bir saýlaýjynyň aýratynlygy sebäpli kontekst sapaklary ulanylyp bilinmez. Käbir ýagdaýlarda, elementiň mazmunyny <div>synp bilen örtmek üçin ýeterlik iş.
Kömekçi tehnologiýalara many bermek
Reňk ulanmak manysyny goşmak üçin diňe ekran okyjylary ýaly kömekçi tehnologiýalary ulanyjylara ýetirip bolmajak wizual görkezme berýär. Reňk bilen görkezilen maglumatlaryň mazmunyň özünden (meselem, görünýän tekstden) aç-açan ýa-da .sr-onlysynp bilen gizlenen goşmaça tekst ýaly alternatiw usullar arkaly girizilendigine göz ýetiriň.
Reňk
.text-başlangyç
.text-ikinji
.text-üstünlik
.text-howp
.text-duýduryş
.text-info
ýagtylyk
.text-dark
.text-body
.text
.text-ak
.text-black-50
.text-white-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>Kontekstdäki tekst sapaklary, berlen aýlaw we fokus ýagdaýlary bolan labyrlarda-da gowy işleýär. Synpyň we synpyň aşagyndaky goşmaça baglanyşyk stiliniň ýokdugyna üns beriň ..text-white.text-muted
<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>Arka reňki
Kontekstdäki tekst reňk synplaryna meňzeş bir elementiň fonuny islendik kontekst synpyna aňsatlyk bilen düzüň. Gämi bölekleri, edil tekst sapaklary ýaly, garaňkyda garalar. Fon hyzmatlary gurulmaýar ,color şonuň üçin käbir ýagdaýlarda kommunal hyzmatlary ulanjak bolarsyňyz .text-*.
<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>Fon gradienti
Haçan (deslapky ) $enable-gradientsdüzülen bolsa , peýdaly sapaklary ulanyp bilersiňiz . Bu sapaklary we başgalary işjeňleşdirmek üçin Sass opsiýalarymyzy öwreniň .truefalse.bg-gradient-
.bg-gradient-primary.bg-gradient-secondary.bg-gradient-success.bg-gradient-danger.bg-gradient-warning.bg-gradient-info.bg-gradient-light.bg-gradient-dark