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.
Bi dersên meya karûbarê nîşana bersivdar nirxa display
xanî 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.
Nîşana çînên bikêrhatî yên ku ji bo hemî xalên veqetînê , ji xs
ber 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 bosm
,md
,lg
, ûxl
.
Ku nirx yek ji wan e:
none
inline
inline-block
block
table
table-cell
table-row
flex
inline-flex
Pirsên medyayê bi xala veqetînê ya diyarkirî an mezintir li firehiyên ekranê bandor dikin . Mînakî, li ser herdu .d-lg-none
û ekranan saz dike.display: none;
lg
xl
<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>
<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>
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êmanek bi bersiv veşêrin.
Ji bo veşartina hêmanan, tenê ji bo her guhertoya ekrana bersivdar .d-none
polê 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-*-none
polê bi polê re bikin yek .d-*-*
, mînakî .d-none .d-md-block .d-xl-none
dê 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 |
<div class="d-lg-none">hide on screens wider than lg</div>
<div class="d-none d-lg-block">hide on screens smaller than lg</div>
display
Dema çapkirinê bi dersên meya karûbarê nîşana çapê re nirxa hêmanan biguhezînin . Piştgiriya ji bo heman display
nirxan 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.
<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>