ئورۇنلاشتۇرۇش ئۈچۈن ئىشلىتىلىدۇ

تېخىمۇ تېز كۆچمە قولايلىق ۋە ئىنكاسچان تەرەققىيات ئۈچۈن ، Bootstrap مەزمۇننى كۆرسىتىش ، يوشۇرۇش ، توغرىلاش ۋە بوشلۇققا ئىشلىتىدىغان ئون نەچچە پايدىلىق دەرسلەرنى ئۆز ئىچىگە ئالىدۇ.

ئۆزگەرتىشdisplay

خاسلىقىمىزنىڭ ئورتاق قىممىتىنى ئىنكاس قايتۇرۇش ئۈچۈن كۆرسىتىش قوراللىرىمىزنى ئىشلىتىڭ display. ئۇنى تور سىستېمىسىمىز ، مەزمۇنىمىز ياكى زاپچاسلىرىمىز بىلەن ئارىلاشتۇرۇپ ، ئۇلارنى ئالاھىدە كۆرۈنۈشلەر ئارا كۆرسىتىش ياكى يوشۇرۇش.

Flexbox تاللانمىلىرى

Bootstrap 4 ئەۋرىشىم ساندۇقى بىلەن ياسالغان ، ئەمما ھەر بىر ئېلېمېنتنىڭ displayشەكلى ئۆزگەرتىلمىگەن ، display: flexچۈنكى بۇ نۇرغۇن زۆرۈر بولمىغان قاپلاشلارنى قوشۇپ ، ئويلىمىغان يەردىن ئاچقۇچلۇق توركۆرگۈچ ھەرىكىتىنى ئۆزگەرتىۋېتىدۇ. زاپچاسلىرىمىزنىڭ كۆپىنچىسى flexbox قوزغىتىلغان.

display: flexئەگەر سىز بىر ئېلېمېنتقا قوشۇشقا ئېھتىياجلىق بولسىڭىز ، ئۇنى .d-flexياكى ئىنكاسچان ۋارىيانتلارنىڭ بىرىنى قىلىڭ (مەسىلەن ، .d-sm-flex). سىز بۇ سىنىپ ياكى displayقىممەتكە ئېھتىياجلىق بولۇپ ، بىزنىڭ قوشۇمچە ئەۋرىشىم قوراللىرىمىزنىڭ چوڭ-كىچىكلىكى ، توغرىلىنىشى ، ئارىلىقى ۋە باشقىلار ئۈچۈن ئىشلىتىشىمىز كېرەك.

Margin and padding

marginبوشلۇق ۋە padding بوشلۇق ئەسلىھەلىرىدىن پايدىلىنىپ ئېلېمېنت ۋە زاپچاسلارنىڭ بوشلۇق ۋە چوڭ-كىچىكلىكىنى كونترول قىلىڭ. 1remBootstrap 4 قىممەت سۈكۈتتىكى $spacerئۆزگەرگۈچى مىقدارنى ئاساس قىلىپ ، بوشلۇق ئەسلىھەلىرىنىڭ بەش دەرىجىلىك كۆلىمىنى ئۆز ئىچىگە ئالىدۇ . بارلىق كۆرۈش نۇقتىلىرىنىڭ قىممىتىنى تاللاڭ (مەسىلەن ، .mr-3ئۈچۈن margin-right: 1rem) ياكى ئالاھىدە كۆرۈنۈشلەرنى نىشانلاش ئۈچۈن ئىنكاسچان ۋارىيانتلارنى تاللاڭ (مەسىلەن ، بۆسۈش ئېغىزىدىن باشلاش .mr-md-3ئۈچۈن ).margin-right: 1remmd

Togglevisibility

توك قاچىلىنىش displayھاجەتسىز بولغاندا ، visibilityبىزنىڭ كۆرۈنۈشچانلىقىمىز بىلەن ئېلېمېنتنى ئالماشتۇرالايسىز . كۆرۈنمەيدىغان ئېلېمېنتلار يەنىلا بەتنىڭ ئورۇنلاشتۇرۇلۇشىغا تەسىر كۆرسىتىدۇ ، ئەمما زىيارەتچىلەردىن كۆرۈنۈشتە يوشۇرۇن.