Xim
Qhia lub ntsiab lus los ntawm cov xim nrog ib txhais tes ntawm cov chav kawm siv xim. Xws li kev txhawb nqa rau kev sib txuas styling nrog hover xeev, ib yam nkaus.
Hais txog qhov tshwj xeeb
Qee zaum cov chav kawm hauv cov ntsiab lus tsis tuaj yeem siv vim qhov tshwj xeeb ntawm lwm tus neeg xaiv. Qee zaum, kev ua haujlwm txaus yog los qhwv koj lub ntsiab lus hauv ib chav <div>nrog chav kawm.
Qhia lub ntsiab lus rau kev pab technologies
Siv cov xim los ntxiv cov ntsiab lus tsuas yog muab qhov pom kev pom, uas yuav tsis raug xa mus rau cov neeg siv cov thev naus laus zis pab - xws li cov ntawv nyeem. Xyuas kom meej tias cov ntaub ntawv qhia los ntawm cov xim yog pom tseeb los ntawm cov ntsiab lus nws tus kheej (xws li cov ntawv pom), lossis suav nrog lwm txoj kev, xws li cov ntawv ntxiv zais nrog cov .sr-onlychav kawm.
Xim
.text-primary
.text-secondary
.text-ua tiav
.text-kev phom sij
.text-warning
.text-info
.text-light
.text-dub
.text-lub cev
.text-muted
.text-dawb
.text-dub-50
.text-dawb-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>Cov chav kawm ntawv cov ntsiab lus kuj ua haujlwm zoo ntawm cov thauj tog rau nkoj nrog rau qhov muab hover thiab tsom xam. Nco ntsoov tias cov chav kawm .text-whitethiab .text-mutedchav kawm tsis muaj qhov txuas ntxiv styling dhau ntawm kab hauv qab.
<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>Xim tom qab
Zoo ib yam li cov chav kawm ntawv xim xim, yooj yim teeb lub keeb kwm yav dhau ntawm ib lub caij rau txhua chav kawm ntawv. Anchor Cheebtsam yuav tsaus rau hover, ib yam li cov ntawv nyeem. Cov khoom siv hauv qab tsis tau teeb tsacolor , yog li qee zaum koj yuav xav siv cov khoom siv .text-*hluav taws xob.
<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>Background gradient
Thaum twg $enable-gradientsyog teem rau true(default yog false), koj tuaj yeem siv .bg-gradient-cov chav kawm siv hluav taws xob. Kawm txog peb cov kev xaiv Sass los pab cov chav kawm no thiab ntau dua.
.bg-gradient-primary.bg-gradient-secondary.bg-gradient-success.bg-gradient-danger.bg-gradient-warning.bg-gradient-info.bg-gradient-light.bg-gradient-dark