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