Gara qabiyyee ijootti darbi Gara docs navigationitti darbi
in English

Gara v5tti godaanuu

Jijjiiramoota faayilii madda Bootstrap, galmeewwanii fi qaamolee v4 irraa gara v5tti akka godaansitu si gargaaruuf hordofi fi gamaaggami.

Fuula kana irratti

Hirkatummaa

  • jQuery gadi dhiise.
  • Popper v1.x irraa gara Popper v2.x tti ol guddate.
  • Libsass Dart Sass tiin bakka buuse akka qindeessaa Sass keenyaa Libsass kennameef hojii irraa oole.
  • Dokumantarii keenya ijaaruuf Jekyll irraa gara Hugotti godaane

Deeggarsa biraawzari

  • Internet Explorer 10 fi 11 gadi dhiise
  • Microsoft Edge < 16 (Legacy Edge) kan gadi bu'e .
  • Firefox < 60 gadi dhiise
  • Safarii gadi bu'e < 12
  • Safari iOS < 12 gadi bu'e
  • Chrome < 60 gadi bu'e

Jijjiirama galmee

  • Fuula jalqabaa, haalata docs, fi jalaqaba irra deebi'amee hojjetame.
  • Qajeelfama Parcel haaraa dabalame .
  • Kutaa Dhuunfachiisi haaraa dabale , fuula Mata duree v4 bakka bu'e , ibsa haaraa Sass irratti, filannoowwan qindeessaa addunyaa, iskiimota halluu, jijjiiramoota CSS, fi kkf.
  • Galmee unkaa hunda gara kutaa Unkaalee haaraatti irra deebi'ee qindeesse , qabiyyee gara fuula caalaatti xiyyeeffannoo qabanitti addaan baase.
  • Haaluma walfakkaatuun, kutaa Haalata haaromse , qabiyyee tarjaa ifatti foon gochuuf.
  • Fuula qaama “Navs” gara “Navs & Tabs”tti jijjiire.
  • Fuula “Checks” jedhu gara “Checks & radios”tti jijjiire.
  • Navbar irra deebi'ee dizaayinii godhee subnav haaraa dabalee marsariitiiwwan keenyaa fi gosoota docs keenya salphaatti akka naanna'an gochuuf.
  • Dirree barbaachaaf karaa gabaabaa gabatee furtuu haaraa dabalame: Ctrl + /.

Sass jedhama

  • Gatii barbaachisoo ta'an salphaatti haquuf walitti makamuu kaartaa Sass durtii ditched gooneerra. Yaada keessa galchi amma gatiiwwan hunda kaartaa Sass keessatti akka $theme-colors. Akkaataa kaartaa Sass itti qabdu ilaalaa .

  • Cabsuucolor-yiq()Faankishinii fi jijjiiramoota walqabatan color-contrast()akka kana booda iddoo halluu YIQ waliin wal hin qabanneef maqaa jijjiire . #30168 ilaali.

    • $yiq-contrasted-thresholdmaqaan isaa gara $min-contrast-ratio.
    • $yiq-text-darkfi $yiq-text-lightakkaataa wal duraa duubaan gara $color-contrast-darkfi $color-contrast-light.

  • CabsuuParameetaroota mixins gaaffii miidiyaa mala loojikii caalaa jijjiiramaniiru.

    • media-breakpoint-down()bakka cabbii itti aanu osoo hin taane qabxii ciccituu ofii isaa fayyadama (fkn, media-breakpoint-down(lg)bakka media-breakpoint-down(md)targets viewports xiqqaa caalaa lg).
    • Haaluma walfakkaatuun, paarameetirri lammaffaan in media-breakpoint-between()akkasumas bakka cabbii itti aanu bakka cabbii mataa isaa fayyadama (fkn, media-between(sm, lg)bakka media-breakpoint-between(sm, md)targets viewports gidduutti smfi lg).

  • CabsuuAkkaataa maxxansaa fi $enable-print-stylesjijjiiramaa haqameera. Kutaawwan agarsiisa maxxansaa ammallee naannoo jiru. #28339 ilaali .

  • Cabsuucolor(), theme-color(), fi faankishiniiwwan gray()jijjiiramoota fayyadu gadi dhiise. #29083 ilaali .

  • Cabsuutheme-color-level()Faankishiniin maqaa jijjiirame gara fi color-level()amma halluuwwan qofa osoo hin taane halluu barbaadde kamiyyuu fudhata $theme-color. #29083 ilaali Of eeggadhu: color-level() boodarra gadi bu'e v5.0.0-alpha3.

  • CabsuuMaqaa jijjiirraa $enable-prefers-reduced-motion-media-queryfi $enable-pointer-cursor-for-buttonsgara $enable-reduced-motionfi $enable-button-pointersgabaabsuuf.

  • CabsuuMiksiin sana bg-gradient-variant()buqqise. .bg-gradientGitaawwan uumaman osoo hin taane qaamolee irratti garaagarummaa dabaluudhaaf gita fayyadami .bg-gradient-*.

  • Cabsuu Miksiinota duraan hin fayyadamne haqaman:

    • hover, hover-focus, plain-hover-focus, fihover-focus-active
    • float()
    • form-control-mixin()
    • nav-divider()
    • retina-img()
    • text-hide()(akkasumas gita faayidaa walqabatee jiru gadi dhiise, .text-hide)
    • visibility()
    • form-control-focus()

  • Cabsuuscale-color()Faankishinii garatti maqaa jijjiirame faankishinii shift-color()iskeelii halluu Sass mataa isaa waliin walitti bu'iinsa akka hin qabneef.

  • box-shadowmixins amma nullgatiiwwan hayyamuu fi nonemurfiiwwan hedduu irraa gadi bu'uu. #30394 ilaali .

  • Miksiin border-radius()amma gatii durtii qaba.

Sirna halluu

  • Sirna halluu kan sirna halluu haaraa fayyadu waliin hojjetee color-level()fi $theme-color-intervalbuqqa'e. Hundi lighten()fi darken()faankishiniiwwan koodii keenya keessa jiran tint-color()fi tiin bakka bu'u shade-color(). Faankishiniiwwan kun salphaa ta'uu isaa hamma murtaa'een jijjiiruu mannaa halluu adii yookiin gurraacha waliin ni makamu. Paarameetariin shift-color()ulfaatina isaa pozaatiivii yookiin negaatiivii ta'uu isaa irratti hundaa'uun halluu tokko ni halluu yookiin golgaa ni taasisa. Bal'ina isaaf #30622 ilaali .

  • Halluu hundaaf halluu fi golgaa haaraa dabale, tokkoon tokkoo halluu bu'uuraatiif halluu adda addaa sagal kenne, akka jijjiiramoota Sass haaraatti.

  • Faallaa halluu fooyya'e. Reeshiyoo walfaallaa halluu 3:1 irraa gara 4.5:1tti bumped fi halluuwwan halluu diimaa, magariisa, saayinii, fi roobaa haaromfamee WCAG 2.1 AA walfaallaa mirkaneessuu. Akkasumas halluu walfaallaa halluu keenyaa irraa $gray-900gara jijjiire $black.

  • Sirna halluu keenya deeggaruuf, halluuwwan keenya sirnaan walitti makuuf amalaafi dalagaalee tint-color()haaraa daballeerra .shade-color()

Fooyya'iinsa giiridii

  • Qabxii cabsuu haaraa! Breakpoint haaraa xxlfor 1400pxfi ol dabalame. Qabxiilee cabsuu biroo hunda irratti jijjiiramni hin jiru.

  • Gutters fooyya'an. Gutters amma rems keessatti saagamaniiru, fi v4 ( 1.5rem, ykn waa'ee 24px, irraa gadi 30px) caalaa dhiphoo dha. Kunis gutters sirna giiridii keenyaa fi faayidaa addaan fageenyaa keenyaa wajjin walsimsiisa.

    • Gutters horizontal/vertical, gutters horizontal, fi gutters dhaabbataa to'achuuf gita gutter haaraa ( .g-*, .gx-*, fi ) dabale..gy-*
    • CabsuuFaayidaa gutter haaraa wajjin akka walsimuuf .no-guttersmaqaa jijjiirame ..g-0

  • Tarjaawwan kana booda hojiirra hin oolan, kanaaf amala sana deebisuuf elementoota tokko tokko irratti position: relativedabaluu qabda ta'a ..position-relative

  • Cabsuu.order-*Kutaalee yeroo baayyee osoo hin fayyadamiin hafan hedduu gadi dhiise. Amma .order-1to .order-5out of the box qofa dhiyeessina.

  • CabsuuFaayidaa wajjin salphaatti fakkaafamuu .mediawaan danda'uuf qaama gadi dhiise. Fakkeenyaaf #28265 fi fuula flex utilities ilaali .

  • Cabsuu bootstrap-grid.cssamma box-sizing: border-boxsafara saanduqa waliigalaa irra deebi'uu mannaa tarjaa qofa irratti hojjeta. Haala kanaan, akkaataan giiridii keenyaa bakka baay'eetti osoo gidduu hin seenin fayyadamuun ni danda'ama.

  • $enable-grid-classeskana booda dhaloota gita qabduu kana booda hin hanqisu. #29146 ilaali.

  • Miksiin make-colgara durtii gara tarjaa walqixaatti hammangaa ifteessame malee fooyyesse.

Qabiyyee, Reboot fi kkf

  • RFS amma durtiidhan dandeessifameera. Mata dureewwan mixin fayyadamanfont-size()ofumaan isaaniifont-sizegara iskeelii agarsiisaa wajjin sirreessa. Amalli kun kanaan dura v4 waliin opt-in ture.

  • Cabsuu$display-*Jijjiiramoota keenya bakka buusuuf fi $display-font-sizeskaartaa Sass tiin maxxansaa agarsiisaa keenya sirreesse. Akkasumas $display-*-weightjijjiiramoota dhuunfaa tokkoof haqee s $display-font-weightsirreeffame .font-size

  • .display-*Hanga mata duree haaraa lama dabale , .display-5fi .display-6.

  • Hidhamtoonni durtiidhaan jala sararamu (hover qofa irratti miti), yoo qaama qaamolee murtaa'oo ta'an malee.

  • Gabateewwan akkaataa isaanii haaromsuu fi jijjiiramoota CSS waliin irra deebi'anii ijaaruuf to'annoo dabalataa akkaataa irratti irra deebi'amee hojjetame.

  • CabsuuGabateewwan man'ee kana booda akkaataa hin dhaalan.

  • Cabsuu .thead-lightfi gita garaagarummaa kanneen elementoota gabatee hundaaf fayyadamuu danda'an .thead-darkfayyadu ( , , , , fi )..table-*theadtbodytfoottrthtd

  • CabsuuMiksiin table-row-variant()gara maqaa jijjiiramee table-variant()fi qajoojiiwwan 2 qofa fudhata: $color(maqaa halluu) fi $value(koodii halluu). Halluu daangaa fi halluuwwan aksentaa jijjiiramoota factor gabatee irratti hundaa'uun ofumaan shallagamu.

  • Jijjiiramoota paadiingii man'ee gabatee gara -yfi -x.

  • CabsuuKutaa gadi dhiise .pre-scrollable. #29135 ilaali

  • Cabsuu .text-*fayyadamtoonni kana booda haalawwan hover fi xiyyeeffannoo walitti hidhamiinsa irratti hin dabalan. .link-*bakka isaa gita gargaaraa fayyadamuun ni danda’ama. #29267 ilaali

  • CabsuuKutaa gadi dhiise .text-justify. #29793 ilaali

  • Cabsuu <hr>elementoonni amma heightbakka amallicha borderhaala gaariin deeggaruuf fayyadamu size. Kunis fayyadama faayidaa paadiingii qoqqoodduu furdaa uumuuf dandeessisa (fkn, <hr class="py-1">).

  • Durtii qajeelaa padding-leftirratti <ul>fi <ol>elementoota durtii biraawzari irraa 40pxgara 2rem.

  • Added $enable-smooth-scroll, kan scroll-behavior: smoothakka addunyaatti hojiirra oolu-fayyadamtoota sochii hir'ifame karaa prefers-reduced-motiongaaffii miidiyaa gaafatan malee. #31877 ilaali

RTL jedhamuun beekama

  • Jijjiiramoonni addaa kallattii qajeelaa, faayidaa, fi makaawwan hundinuu amaloota loojikii akka kanneen qindaa'inoota flexbox keessatti argaman fayyadamuuf maqaa jijjiiramaniiru-fkn, startfi endbakka leftfi right.

Unkaalee

  • Unkaalee haaraa lola'an dabalameera! Fakkeenya asxaalee lola'oo gara qaamolee unkaa guutummaatti deeggaramaniitti guddifneerra. Fuula asxaalee lola'aa haaraa ilaali.

  • Cabsuu Qaamolee unkaa dhalootaa fi amala walitti makaman. Sanduuqawwan filannoo, raadiyoowwan, filannoowwanii, fi galteewwan biroo kanneen v4 keessatti gita dhalootaa fi amala qaban walitti makamaniiru. Amma elementoonni unkaa keenya hundi jechuun ni danda'ama guutummaatti amala, irra caalaan isaanii HTML amala osoo hin barbaachisin.

    • .custom-checkamma .form-check.
    • .custom-check.custom-switchamma .form-check.form-switch.
    • .custom-selectamma .form-select.
    • .custom-fileakkasumas .form-fileakkaataa aadaatiin gubbaatti bakka bu'aniiru .form-control.
    • .custom-rangeamma .form-range.
    • Dhalataa .form-control-filefi .form-control-range.

  • CabsuuKufee .input-group-appendfi .input-group-prepend. Amma qaree fi .input-group-textakka ijoollee kallattii gareewwan galtee qofa dabaluu dandeessa.

  • Raadiyaasiin daangaa yeroo dheeraa garee galtee irratti dogongora yaada mirkaneessuu waliin dhabame dhuma irratti .has-validationgareewwan galtee mirkaneessuu qabanitti gita dabalataa dabaluudhaan sirreeffama .

  • Cabsuu Sirna giiridii keenyaaf gitoota qindaa'ina unkaa addaa gadi dhiise. .form-groupBakka , .form-row, ykn giiridii fi faayidaa keenya fayyadami .form-inline.

  • CabsuuAsxaaleen unkaa amma barbaadu .form-label.

  • Cabsuu .form-textkana booda hin saagi display, barruu gargaarsaa sarara keessaa ykn ugguruu akka barbaaddetti qaama HTML jijjiiruu qofaan akka uumtu si dandeessisa.

  • Mallattoolee mirkaneessuu kana booda <select>s with multiple.

  • Faayilota Sass madda irra deebi'amee qindaa'e jalatti scss/forms/, akkaataa garee galtee dabalatee.

Qaamolee

  • Gatii tokkoome paddingakeekkachiisa, daabboo, kaardii, gadi bu'aa, gareewwan tarree, moodaalota, popovers, fi gorsa meeshaalee $spacerjijjiiramaa keenya irratti hundaa'uuf. #30564 ilaali .

Akkoordiyoonii

Akeekkachiisa

  • Akeekkachiisni amma fakkeenyota mallattoolee qaban qabu .

  • Akkaataawwan amala <hr>s tokkoon tokkoo akeekkachiisa keessatti erga isaan duraan fayyadamaniif haqameera currentColor.

Baajiiwwan

  • Cabsuu.badge-*Faayidaa duubbeedhaaf gita halluu hunda gadi dhiise (fkn, .bg-primarybakka fayyadami .badge-primary).

  • CabsuuGadi .badge-pillbu'e —bakka isaa .rounded-pillfaayilii fayyadami.

  • CabsuuAkkaataawwan hover fi xiyyeeffannoo <a>fi <button>elementootaaf haqameera.

  • Padding durtii baajiiwwan / irraa .25emgara / .5emtti .35emdabale .65em.

  • Mul'ata durtii daabboo padding, background-color, fi balleessuun salphise border-radius.

  • --bs-breadcrumb-dividerCSS irra deebi'anii qindeessuu osoo hin barbaachisin dhuunfachiisuuf qabeentaa amala CSS haaraa dabale .

Qabduulee

  • Cabsuu Qabduu jijjiiri , sanduuqa filannoo ykn raadiyoo waliin, kana booda JaavaScript hin barbaadanii fi mallattoo haaraa qabu. Kana booda elementii marfama hin barbaannu, ,.btn-checkirrattigita<input>kamiyyuu. #30650 ilaali . Kanaaf docs fuula Buttons keenya irraa gara kutaa Unka haaraatti ce'eera..btn<label>

  • Cabsuu Faayidaadhaaf .btn-blockgadi bu'e. .btn-block, irratti fayyadamuu mannaa .btn, qaree kee akka barbaachisummaa isaatti addaan baasuuf .d-gridfi .gap-*faayidaa waliin marsi. To'annoo daran isaan irratti argachuuf gara daree deebii kennuutti jijjiiri. Fakkeenya tokko tokkoof docs dubbisi.

  • Parameetaroota dabalataa deeggaruuf keenya button-variant()fi mixins haaromse.button-outline-variant()

  • Qabduu fooyya'e kan walfaallaa dabaluu hover fi haalata socho'aa irratti mirkaneessuuf.

  • Qabduulee hanqifaman amma pointer-events: none;.

Kaardii

  • Cabsuu.card-deckGiriidii keenya fayyadu kufe . Kaardii kee gita tarjaa keessatti marsi fi qabduu warraa dabali .row-cols-*deekii kaardii irra deebi'ii uumuuf (garuu to'annoo dabalataa qindaa'ina deebii irratti).

  • CabsuuMasonry .card-columnsdeggeruuf kufe. #28922 ilaali .

  • Cabsuu.cardAccordion bu'uura godhate qaama Accordion haaraatiin bakka buuse .

Qabduu cufi

  • CabsuuMaqaa waliigalaa xiqqaa ta'eef .closegara maqaa jijjiirame..btn-close

  • Qabduulee cufi amma HTML keessatti background-imagebakka a (SVG ukkaamfame) fayyadamu &times;, mallattoo kee tuquu osoo hin barbaachisin dhuunfachiisuun salphaa ta'e hayyama.

  • .btn-close-whiteGaraagarummaa haaraa kan filter: invert(1)mallattoolee kuffisuu walfaallaa ol'aanaa duubbee dukkanaa'aa irratti dandeessisuuf fayyadamu dabalame.

Ijaarsi kufuu

  • Accordions'f scroll anchoring haqameera.

  • Jijjiiramoota haaraa .dropdown-menu-darkfi jijjiiramoota walqabatan tarreewwan dukkanaa gaaffii irratti dabalame.

  • Jijjiiramaa haaraa dhaaf dabalame $dropdown-padding-x.

  • Faallaa fooyya'aa ta'eef qoqqoodduu gadi bu'aa dukkanesse.

  • CabsuuTaateewwan hunduu tarreef amma qaree jijjiirraa tarree irratti kakaafamu sana booda gara qaama warraatti bubbee.

  • Sajoo kamshaa amma data-bs-popper="static"yeroo iddoon gadi bu'aa dhaabbataa ta'ee fi data-bs-popper="none"yeroo gadi bu'iinsi barruu navbar keessa jiru saagama amaloota qabu. Kunis JaavaScript keenyaan kan dabalame yoo ta'u, akkaataa Popper's positioning osoo hin gufachiisiin akkaataa ejjennoo amala fayyadamuuf nu gargaara.

  • CabsuuFilannoon gadi bu'aa plugin flipqindeessaa dhalootaa Popper fayyadu gadi bu'e. Amma amala garagalchuu fallbackPlacementsfilannoodhaaf tarree duwwaa fooyyessaa garagalchuu keessatti dabarsuudhaan hanqisuu dandeessa.

  • Menuuwwan gadi bu'aa amma amala ofumaan cufuuautoClose qabachuuf filannoo haaraa wajjin cuqaasuu danda'u . Filannoo kana fayyadamuun cuqaasuu sajoo tarree keessaa ykn alaa fudhachuun akka wal-qunnamsiisu gochuu dandeessa.

  • Dropdowns amma s s .dropdown-itemkeessatti marfame deeggaru <li>.

Jumbotroon jedhamuun beekama

Garee tarreessi

  • nullJijjiiramoota haaraa font-size, font-weight, , colorfi gitaatti dabale.:hover color.nav-link
  • CabsuuNavbars amma qabduu keessaa barbaadu (barbaachisummaa addaan fageenyaa fi CSS barbaachisu haalaan salphisuuf).

Kanfaasiin ala

Fuulaa (Pagination) jedhu

  • Hidhamtoonni fuula amma kan dhuunfamuu margin-leftdanda'an kan yeroo walirraa adda baafaman golee hunda irratti daayinamiikiin geengoo ta'an qabu.

  • transitionHidhamtoota fuulaatti s dabalame .

Popovers jedhaman

  • CabsuuUnka popover durtii keenya keessatti .arrowgara maqaa jijjiirame ..popover-arrow

  • Filannoo whiteListgara allowList.

Spinners jedhaman

  • Spinners amma prefers-reduced-motion: reduceanimations saffisiisuun kabaju. #31882 ilaali .

  • Hiriirsa dhaabbataa ispiinaraa fooyya'e.

Toostii

  • Toasts amma gargaarsa positioning utilities tiin a keessatti dhaabuun ni danda'ama ..toast-container

  • Yeroo toostii durtii gara sekondii 5tti jijjiire.

  • Toostii overflow: hiddenirraa baafamee border-radiuss sirrii ta'een bakka bu'e calc()dalagaalee wajjin.

Gorsa Meeshaalee

  • CabsuuUnkaa gorsa meeshaa durtii keenya keessatti .arrowgara maqaa jijjiirame ..tooltip-arrow

  • CabsuuGatiin durtii kan gara iddoo fooyya'aa elementoota popperiif fallbackPlacementsjijjiirama .['top', 'right', 'bottom', 'left']

  • CabsuuFilannoo whiteListgara allowList.

Faayidaa (Utilities) jedhaman

  • CabsuuDeeggarsa RTL dabaluudhaan maqaa kallattii osoo hin taane maqaa qabeentaa loojikii fayyadamuuf faayilii hedduu maqaa jijjiire:

    • Maqaa jijjiirraa .left-*fi .right-*gara .start-*fi .end-*.
    • Maqaa jijjiirraa .float-leftfi .float-rightgara .float-startfi .float-end.
    • Maqaa jijjiirraa .border-leftfi .border-rightgara .border-startfi .border-end.
    • Maqaa jijjiirraa .rounded-leftfi .rounded-rightgara .rounded-startfi .rounded-end.
    • Maqaa jijjiirraa .ml-*fi .mr-*gara .ms-*fi .me-*.
    • Maqaa jijjiirraa .pl-*fi .pr-*gara .ps-*fi .pe-*.
    • Maqaa jijjiirraa .text-leftfi .text-rightgara .text-startfi .text-end.

  • CabsuuMarginoota negaatiivii durtiidhaan hanqifame.

  • Duubbee 's gara elementoota dabalataatti .bg-bodysaffisaan saaguuf gita haaraa dabalame .<body>

  • Faayidaa ejjennoo haaraa , top, right, bottomfi left. Gatiin tokkoon tokkoo qabeentaatiif 0, 50%, fi of keessatti qabata.100%

  • Haaraa .translate-middle-x& .translate-middle-yfaayidaa gara qajeelaa ykn dhaabbataa giddugaleessa elementoota absoluutii/dhaabbataa ejjennoo qabanitti dabalame.

  • border-widthFaayidaa haaraa dabalame .

  • CabsuuMaqaa jijjiirame .text-monospacegara .font-monospace.

  • Cabsuu.text-hideBarreeffama kana booda itti fayyadamuu hin qabne dhoksuuf mala dulloome waan ta'eef haqameera .

  • .fs-*Faayidaawwan faayiliidhaaf dabalaman font-size(RFS dandeessifame waliin). Isaan kun iskeelii walfakkaataa mata dureewwan durtii HTML fayyadamu (1-6, guddaa hanga xiqqaa), fi karaa kaartaa Sass fooyya'uu danda'u.

  • Cabsuu.font-weight-*Faayidaa akka .fw-*gabaabsuu fi walsimannaatti maqaa jijjiirame .

  • Cabsuu.font-style-*Faayidaa akka .fst-*gabaabsuu fi walsimannaatti maqaa jijjiirame .

  • .d-gridFaayidaa fi faayidaa haaraa agarsiisuuf dabalame gap( .gap) qindaa'inoota CSS Grid fi flexbox.

  • CabsuuBuqqisee .rounded-smfi rounded-lg, fi iskeelii haaraa daree, .rounded-0gara .rounded-3. #31687 ilaali .

  • line-heightFaayidaa haaraa dabalame : .lh-1, .lh-sm, .lh-basefi .lh-lg. As ilaalaa .

  • .d-noneFaayidaa agarsiisaa biroo irratti ulfaatina caalu akka kennuuf CSS keenya keessatti faayilii sochoose .

  • Gargaaraa dheeressee .visually-hidden-focusableakkasumas qabduu irratti hojjechuuf, fayyadamuun :focus-within.

Gargaartoota

  • Cabsuu Gargaartoonni embed deebii kennan gara gargaartota reeshiyoo maqaa gita haaraa fi amala fooyya'aa qaban, akkasumas jijjiiramaa CSS gargaaraa ta'etti maqaa jijjiiramaniiru.

    • Kutaawwan gara reeshiyoo aspeektii keessatti byakka jijjiiramaniif maqaan isaanii jijjiiramaniiru . xFakkeenyaaf, .ratio-16by9amma .ratio-16x9.
    • .embed-responsive-itemFilataa garee elementii fi filannoo salphaa ta'e fayyadu gadi dhiifneerra .ratio > *. Gitni dabalataa hin barbaachisu, fi gargaaraan reeshiyoo amma elementii HTML kamiyyuu wajjin hojjeta.
    • Kaartaan $embed-responsive-aspect-ratiosSass gara maqaa jijjiiramee $aspect-ratiosgatiiwwan isaas maqaa gitaa fi dhibbeentaa akka lamaanitti hammachuudhaaf key: valuesalphataniiru.
    • Jijjiiramoonni CSS amma uumamanii tokkoon tokkoo gatii kaartaa Sass keessatti hammatamaniiru. --bs-aspect-ratioJijjiiramaa irratti fooyyessii reeshiyoo aspeektii amala.ratio kamiyyuu uumuuf .

  • Cabsuu Kutaawwan “dubbisaa iskiriinii” amma dareewwan “mul’ataan dhokatan” ta’aniiru .

    • Faayilii Sass irraa scss/helpers/_screenreaders.scssgara jijjiirescss/helpers/_visually-hidden.scss
    • Maqaa jijjiirraa .sr-onlyfi .sr-only-focusablegara .visually-hiddenfi.visually-hidden-focusable
    • Maqaa jijjiirraa sr-only()fi sr-only-focusable()mixins gara visually-hidden()fi visually-hidden-focusable().

  • bootstrap-utilities.cssamma gargaartota keenyas ni dabalata. Gargaartoonni kana booda ijaarsa amala keessatti galchuu hin barbaachisan.

JaavaScript

  • Hirkatummaa jQuery gadi dhiisee fi JavaScript idilee keessa akka ta'aniif ifteessitoota irra deebi'ee barreesse.

  • CabsuuAmaloonni deetaa ifteessitoota JaavaScript hundaaf amma maqaa addaan baafamanii hojii Bootstrap qaama sadaffaa fi koodii mataa keetii irraa adda baasuuf gargaara. Fakkeenyaaf, data-bs-togglebakka data-toggle.

  • Amma pilaaginoonni hundi akka murfii jalqabaatti filannoo CSS fudhachuu danda'u. Fakkeenya haaraa ifteessaa uumuuf qaama DOM ykn filannoo CSS sirrii kamiyyuu dabarsuu dandeessa:

    var modal = new bootstrap.Modal('#myModal')
var dropdown = new bootstrap.Dropdown('[data-bs-toggle="dropdown"]')

  • popperConfigakka faankishinii qindeessaa Popper durtii Bootstrap akka falmii fudhatutti darbuu danda'a, akka ati qindeessaa durtii kana karaa keetiin walitti makuu dandeessuuf. Kubbaawwan, popovers, fi tooltips irratti hojjata.

  • Gatiin durtii kan gara iddoo fooyya'aa elementoota Popperiif fallbackPlacementsjijjiirama . Kubbaawwan, popovers, fi tooltips irratti hojjata.['top', 'right', 'bottom', 'left']

  • Malawwan istaatiksii uummataa kan akka _getInstance()→ irraa jala sarara haqameera getInstance().