SourceButton group
بىر قاتار كۇنۇپكىلارنى بىر گۇرۇپپا كۇنۇپكا گۇرۇپپىسى بىلەن بىر گۇرۇپپا قىلىپ ، JavaScript ئارقىلىق دەرىجىدىن تاشقىرى قۇۋۋەتلەڭ.
ئاساسلىق مىسال
ئىچىگە بىر يۈرۈش كۇنۇپكىلارنى ئوراپ .btn
بېرىڭ .btn-group
. ئىختىيارىي JavaScript رادىئوسى ۋە تەكشۈرۈش رامكىسى ئۇسلۇبىدىكى ھەرىكەتلەرنى بىزنىڭ كۇنۇپكا قىستۇرمىمىز بىلەن قوشۇڭ .
توغرا role
ۋە بەلگە بىلەن تەمىنلەشكە كاپالەتلىك قىلىڭ
ياردەمچى تېخنىكىلار (ئېكران ئوقۇرمەنلىرى دېگەندەك) بىر قاتار كۇنۇپكىلارنىڭ گۇرۇپپىلانغانلىقىنى يەتكۈزۈش ئۈچۈن ، مۇۋاپىق role
خاسلىق بىلەن تەمىنلەش كېرەك. كۇنۇپكا گۇرۇپپىلىرىغا نىسبەتەن بۇ بولىدۇ role="group"
، قورالبالدىقىدا a بولۇشى كېرەك role="toolbar"
.
بۇنىڭدىن باشقا ، گۇرۇپپىلار ۋە قورال ستونىغا ئېنىق بەلگە بېرىلىشى كېرەك ، چۈنكى نۇرغۇن ياردەمچى تېخنىكىلار توغرا رول خاسلىقىغا ئىگە بولسىمۇ ، ئۇلارنى ئېلان قىلمايدۇ. بۇ يەردە تەمىنلەنگەن مىساللاردا بىز ئىشلىتىمىز aria-label
، ئەمما باشقا تاللاشلارنىمۇ aria-labelledby
ئىشلىتىشكە بولىدۇ.
تېخىمۇ مۇرەككەپ زاپچاسلار ئۈچۈن بىر يۈرۈش كۇنۇپكا گۇرۇپپىلىرىنى كۇنۇپكا قورال ستونىغا بىرلەشتۈرۈڭ. گۇرۇپپىلار ، كۇنۇپكىلار ۋە باشقا بوشلۇقلارغا ئېھتىياجلىق بولغاندا پايدىلىق دەرسلەرنى ئىشلىتىڭ.
قورالبالدىقىڭىزدىكى كۇنۇپكا گۇرۇپپىلىرى بىلەن كىرگۈزۈش گۇرۇپپىلىرىنى ئارىلاشتۇرۇڭ. يۇقارقى مىسالغا ئوخشاش ، گەرچە بوشلۇقنى مۇۋاپىق ئورۇنلاشتۇرسىڭىزمۇ ، بىر قىسىم ئاممىۋى مۇلازىمەتلەرگە ئېھتىياجلىق بولۇشىڭىز مۇمكىن.
Sizing
بىر گۇرۇپپىدىكى ھەر بىر كۇنۇپكىغا كۇنۇپكا چوڭلۇقتىكى دەرسلەرنى ئىشلىتىشنىڭ ئورنىغا ، ھەر بىر گۇرۇپپىغا قوشۇڭ ، كۆپ گۇرۇپپىنى ئۇۋلىغاندا ھەر بىرسىنى ئۆز ئىچىگە ئالىدۇ .btn-group-*
..btn-group
Nesting
تارتما تىزىملىكلەرنى بىر قاتار كۇنۇپكىلار بىلەن ئارىلاشتۇرماقچى بولغاندا ، .btn-group
باشقا ئورۇنغا قويۇڭ..btn-group
ۋېرتىكال ئۆزگىرىش
بىر يۈرۈش كۇنۇپكىلارنى توغرىسىغا ئەمەس تىك ھالەتتە تىزىپ قويۇڭ. بۇ يەردە بۆلۈش كۇنۇپكىسىنى چۈشۈرۈشنى قوللىمايدۇ.