Dagiti kolor
Ipaawat ti kaipapanan babaen ti kolor babaen ti sumagmamano a klase ti utilidad ti kolor. Iramanna ti suporta para kadagiti silpo ti estilo kadagiti estado ti hover, met.
Panangtaming iti kinaespesipiko
No dadduma dagiti klase ti konteksto ket saan a maipakat gapu ti kinaespesipiko ti sabali a mangpili. Iti dadduma a kaso, ti umdas a panagliklik ket ti panangibalkot ti linaon ti elementom iti a <div>
iti klase.
Panangipaay ti kaipapanan kadagiti makatulong a teknolohia
Ti panagusar ti kolor tapno mangnayon ti kaipapanan ket mangipaay laeng ti makita a pakakitaan, a saan a maidanon kadagiti agar-aramat kadagiti makatulong a teknolohia – kas dagiti screen reader. Siguraduen a ti impormasion a naipasimudaag babaen ti kolor ket nalawag manipud iti linaon a mismo (kas pagarigan ti makita a teksto), wenno mairaman babaen dagiti alternatibo a wagas, a kas ti kanayonan a teksto a nailemmeng a kadua ti .sr-only
klase.
Maris
.teksto-pangruna
.teksto-segundario
.teksto-balligi
.teksto-peggad
.teksto-a-pakdaar
.teksto-info
.teksto-silaw
.teksto-nasipnget
.teksto-bagi
.teksto-naulimek
.teksto-puraw
.teksto-nangisit-50
.teksto-puraw-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>
Dagiti klase ti teksto ti konteksto ket agtrabaho pay a nasayaat kadagiti angkla nga addaan kadagiti naited a hover ken dagiti estado ti pokus. Imutektekanyo a ti .text-white
ken .text-muted
klase ket awan ti kanayonan nga estilo ti silpo iti labes ti underline.
<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>
Kolor ti likudan
Kasla dagiti klase ti kolor ti teksto ti konteksto, nalaka nga ikeddeng ti likudan ti maysa nga elemento iti ania man a klase ti konteksto. Agsipnget dagiti paset ti angkla iti hover, kas met laeng kadagiti klase ti teksto. Saan nga ikeddengcolor
dagiti utilidad ti likudan , isu nga iti dadduma a kaso kayatmo nga usaren .text-*
dagiti utilidad.
<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>
Gradiente ti likudan
No $enable-gradients
naikeddeng iti true
(default ket false
), mabalinmo nga usaren .bg-gradient-
dagiti klase ti utilidad. Ammuem ti maipapan kadagiti pagpilianmi iti Sass tapno mapalubosan dagitoy a klase ken dadduma pay.
.bg-gradient-primary
.bg-gradient-secondary
.bg-gradient-success
.bg-gradient-danger
.bg-gradient-warning
.bg-gradient-info
.bg-gradient-light
.bg-gradient-dark