in English

Dathanna

Cuir an chiall in iúl trí dhath le dornán de ranganna áirgiúlachta datha. Áirítear leis sin tacaíocht do naisc stílithe le stáit hover, freisin.

Ag déileáil le sainiúlacht

Uaireanta ní féidir ranganna comhthéacsúla a chur i bhfeidhm mar gheall ar shainiúlacht roghnóir eile. I gcásanna áirithe, is réiteach leordhóthanach é ábhar d’eiliminte a chuimilt <div>leis an rang.

Brí a chur in iúl do theicneolaíochtaí cúnta

Ní thugann úsáid dath chun brí a chur leis ach tásc amhairc, nach gcuirfear in iúl d’úsáideoirí na dteicneolaíochtaí cúnta – mar léitheoirí scáileáin. Cinntigh go bhfuil an t-eolas atá sainaitheanta leis an dath soiléir ón ábhar féin (m.sh. an téacs infheicthe), nó go n-áirítear í ar mhodhanna eile, mar théacs breise i bhfolach leis an .sr-onlyrang.

Dath

.téacs-bunscoile

.téacs-tánaisteach

.téacs-rath

.téacs-chontúirt

.téacs-rabhadh

.téacs-eolas

.téacs-éadrom

.téacs-dorcha

.téacs-chomhlacht

.téacs-bhalbhaithe

.téacs-bán

.téacs-dubh-50

.téacs-bán-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>

Oibríonn ranganna téacs comhthéacsacha go maith freisin ar ancairí leis na staideanna ainlithe agus fócais a chuirtear ar fáil. Tabhair faoi deara nach bhfuil aon nasc-stíleáil bhreise ag an rang .text-whiteagus ag an rang thar an líne..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>

Dath an chúlra

Cosúil leis na haicmí datha téacs comhthéacsúla, socraigh go héasca cúlra eilimint d’aon rang comhthéacsúil. Dorchóidh comhpháirteanna ancaire ar ainlíonn, díreach cosúil leis na ranganna téacs. Ní leagtarcolor fóntais chúlra , mar sin i gcásanna áirithe beidh tú ag iarraidh .text-*fóntais a úsáid.

.bg-bunscoil
.bg-tánaisteach
.bg-rath
.bg-chontúirt
.bg-rabhaidh
.bg-eolas
.bg-éadrom
.bg-dorcha
.bg-bhán
.bg-trédhearcach
<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>

Grádán cúlra

Nuair $enable-gradientsatá sé socraithe go true(réamhshocraithe é false), is féidir leat .bg-gradient-ranganna fóntais a úsáid. Foghlaim faoi ár roghanna Sass chun na ranganna seo agus níos mó a chumasú.

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