in English

ڕەنگەکان

گەیاندنی مانا لە ڕێگەی ڕەنگەوە بە مشتێک پۆلی سوودمەندی ڕەنگ. پشتگیری بۆ ستایلکردنی بەستەرەکان لەگەڵ دۆخی هۆڤەر لەخۆدەگرێت، هەروەها.

مامەڵەکردن لەگەڵ تایبەتمەندی

هەندێک جار بەهۆی تایبەتمەندی هەڵبژێرەرێکی دیکەوە ناتوانرێت پۆلە کۆنتێکستەکان بەکاربهێنرێت. لە هەندێک حاڵەتدا، چارەسەرێکی بەس ئەوەیە کە ناوەڕۆکی توخمەکەت لە a <div>لەگەڵ پۆلەکەدا بپێچیتەوە.

گەیاندنی مانا بۆ تەکنەلۆژیا یارمەتیدەرەکان

بەکارهێنانی ڕەنگ بۆ زیادکردنی مانا تەنیا ئاماژەیەکی بینراو دەدات، کە ناگەیەنرێتە بەکارهێنەرانی تەکنەلۆژیا یارمەتیدەرەکان – وەک خوێنەری شاشە. دڵنیابە لەوەی کە ئەو زانیاریانەی کە بە ڕەنگەکە دیاری دەکرێن یان لە خودی ناوەڕۆکەکەوە دیارن (بۆ نموونە دەقی بینراو)، یان لە ڕێگەی ئامرازی بەدیلەوە جێگیر دەکرێن، وەک دەقی زیادە کە لەگەڵ .sr-onlyپۆلەکەدا شاراوەتەوە.

ڕەنگ

.دەق-سەرەکی

.دەق-لاوەکی

.دەق-سەرکەوتن

.دەق-مەترسی

.ئاگادارکردنەوەی دەق

.زانیاری دەق

.دەق-ڕووناکی

.دەق-تاریک

.دەق-جەستە

.دەق-بێدەنگ کراوەتەوە

.دەق-سپی

.دەق-ڕەش-50

.دەق-سپی-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>

هەروەها پۆلەکانی دەقی کۆنتێکست بە باشی کار لەسەر ئەنکرەکان دەکەن بە دۆخی هۆڤەر و فۆکەسی دابینکراو. تێبینی بکە کە پۆلی .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>

ڕەنگی باكگراوند

هاوشێوەی پۆلەکانی ڕەنگی دەقی کۆنتێکست، بە ئاسانی پاشبنەمای توخمێک بۆ هەر پۆلێکی کۆنتێکست دابنێ. پێکهاتەکانی ئەنکر لە کاتی هۆڤەردا تاریک دەبن، هەروەک پۆلەکانی دەق. سوودمەندیەکانی پاشبنەما دانانێن ,color بۆیە لە هەندێک حاڵەتدا دەتەوێت .text-*سوودمەندیەکان بەکاربهێنیت.

.bg-سەرەکی
.bg-لاوەکی
.bg-سەرکەوتن
.bg-مەترسی
.bg-ئاگادارکردنەوە
.bg-زانیاری
.bg-ڕووناکی
.bg-تاریک
.bg-سپی
.bg-شەفاف
<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>

گرادێنتێکی پاشبنەما

کاتێک $enable-gradientsلەسەر true(بەپێی پێشوەختە false) دانراوە، دەتوانیت .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