in English

Taybetmendiyê nîşan bide

Bi karûbarên pêşandana me re bi lez û bez nirxa pêşandana pêkhateyan û bêtir biguhezînin. Piştgiriyek ji bo hin nirxên gelemperî, û her weha hin pêvekên ji bo kontrolkirina dîmenderê dema çapkirinê vedihewîne.

Çawa dixebite

Bi dersên meya karûbarê nîşana bersivdar nirxa displayxanî biguhezînin. Em bi mebest tenê beşek ji hemî nirxên gengaz ji bo piştgirî dikin display. Ders dikarin ji bo bandorên cihêreng ên ku hûn hewce ne bêne hev kirin.

Notation

Nîşana çînên bikêrhatî yên ku ji bo hemî xalên veqetînê , ji xsber xl, di wan de kurtenivîsa xala veqetînê tune. Ev ji ber ku ew ders ji min-width: 0;û jor têne sepandin, û bi vî rengî bi pirsek medyayê ve girêdayî ne. Lêbelê, xalên veqetandinê yên mayî, kurtenivîsek xala veqetînê vedihewînin.

Bi vî rengî, çîn bi karanîna formê têne nav kirin:

  • .d-{value}boxs
  • .d-{breakpoint}-{value}ji bo sm, md, lg, û xl.

Ku nirx yek ji wan e:

  • none
  • inline
  • inline-block
  • block
  • table
  • table-cell
  • table-row
  • flex
  • inline-flex

Nirxên $displaysxuyangê dikarin bi guheztina guhêrbar û ji nû ve berhevkirina SCSS-ê werin guheztin.

Pirsên medyayê bi xala veqetînê ya diyarkirî an mezintir bandorê li firehiyên ekranê dikin . Mînakî, li ser herdu .d-lg-noneû ekranan saz dike.display: none;lgxl

Examples

d-inline
d-inline 
<div class="d-inline p-2 bg-primary text-white">d-inline</div>
<div class="d-inline p-2 bg-dark text-white">d-inline</div>
d-block d-block 
<span class="d-block p-2 bg-primary text-white">d-block</span>
<span class="d-block p-2 bg-dark text-white">d-block</span>

Hêmanên veşartî

Ji bo pêşkeftina heval-mobîl zûtir, dersên dîmendera bersivdar bikar bînin da ku hêmanên ji hêla cîhazê ve nîşan û veşêrin. Ji afirandina guhertoyên bi tevahî cihêreng ên heman malperê dûr bisekinin, li şûna wê ji bo her mezinahiya ekranê hêmanên bi bersiv veşêrin.

Ji bo veşartina hêmanan, tenê ji bo her guhertoya ekrana bersivdar .d-nonepolê an yek ji çînan bikar bînin..d-{sm,md,lg,xl}-none

Ji bo ku hêmanek tenê li ser navberek diyarkirî ya mezinahiyên ekranê nîşan bidin, hûn dikarin yek .d-*-nonepolê bi polê re bikin yek .d-*-*, mînakî .d-none .d-md-block .d-xl-nonedê hêmanê ji bo hemî pîvanên ekranê ji bilî cîhazên navîn û mezin veşêrin.

Mezinahiya Screen Sinif
Li ser her tiştî veşartî .d-none
Tenê li ser xs veşartî .d-none .d-sm-block
Tenê li ser sm veşartî .d-sm-none .d-md-block
Tenê li ser md veşartî .d-md-none .d-lg-block
Tenê li ser lg veşartî .d-lg-none .d-xl-block
Tenê li ser xl veşartî .d-xl-none
Li ser hemûyan xuya dibe .d-block
Tenê li ser xs xuya dibe .d-block .d-sm-none
Tenê li ser sm xuya dibe .d-none .d-sm-block .d-md-none
Tenê li ser md xuya dibe .d-none .d-md-block .d-lg-none
Tenê li ser lg xuya dibe .d-none .d-lg-block .d-xl-none
Tenê li ser xl xuya dibe .d-none .d-xl-block
li ser ekranên lg û berfireh veşêrin
li ser ekranên ji lg piçûktir veşêrin 
<div class="d-lg-none">hide on lg and wider screens</div>
<div class="d-none d-lg-block">hide on screens smaller than lg</div>

Di çapê de nîşan bide

displayDema çapkirinê bi dersên meya karûbarê nîşana çapê re nirxa hêmanan biguhezînin . Piştgiriya ji bo heman displaynirxan wekî karûbarên me yên bersivdar .d-*vedihewîne.

  • .d-print-none
  • .d-print-inline
  • .d-print-inline-block
  • .d-print-block
  • .d-print-table
  • .d-print-table-row
  • .d-print-table-cell
  • .d-print-flex
  • .d-print-inline-flex

Dersên çap û pêşandanê dikarin bêne hev kirin.

Tenê ekran (tenê li ser çapê veşêre)
Tenê çap bike (Tenê li ser ekranê veşêre)
Li ser ekranê heya mezin veşêrin, lê her gav li ser çapê nîşan bidin 
<div class="d-print-none">Screen Only (Hide on print only)</div>
<div class="d-none d-print-block">Print Only (Hide on screen only)</div>
<div class="d-none d-lg-block d-print-block">Hide up to large on screen, but always show on print</div>