U gudub nuxurka muhiimka ah U gudub dukumentiyada navigation
in English

U guuraya v5

Raad-raac oo dib u eeg isbeddellada ku yimaadda Bootstrap-ga faylalka, dukumeentiyada, iyo qaybaha si ay kaaga caawiyaan inaad ka guurto v4 una guurto v5.

Boggan

Ku-tiirsanaanta

  • tuuray jQuery
  • Laga cusboonaysiiyay Popper v1.x ilaa Popper v2.x.
  • Libsass lagu beddelay Dart Sass sidii isku-dubaridiyahayaga Sass ee la siiyay Libsas waa la joojiyay.
  • Waxaan uga soo haajiray Jekyll una guuray Hugo si loo dhiso dukumentiyadayada

Taageerada browserka

  • Internet Explorer 10 iyo 11 ayaa la tuuray
  • La tuuray Microsoft Edge <16 (Legacy Edge)
  • Firefox waa la tuuray <60
  • Safari la tuuray <12
  • IOS Safari oo la tuuray <12
  • Chrome la tuuray <60

Dukumentiyada ayaa isbedela

  • Dib loo habeeyay bogga hoyga, qaabaynta dokumentiyada, iyo cagaha.
  • Lagu daray hagaha baakadka cusub
  • Lagu daray qayb cusub oo habayn , oo lagu bedelayo v4's Theming page , oo leh faahfaahin cusub oo ku saabsan Sass, doorashooyinka qaabaynta caalamiga ah, nidaamyada midabka, doorsoomayaasha CSS, iyo in ka badan.
  • Dib u habaynta dhammaan dukumeentiyada foomamka qayb cusub oo foomamka , iyada oo u kala saaraysa waxa ku jira bogag aad diirada u saaran.
  • Sidoo kale, la cusboonaysiiyay qaybta qaabaynta , si aad si cad uga saarto nuxurka shabakada.
  • Waxaa loo beddelay "Navs" bogga qaybta "Navs & Tabs".
  • Bogga "Checks" waxaa loo beddelay "Checks & radios".
  • Dib u habayn ku samaysay navbar-ka oo ku daray subnav cusub si ay u fududayso in aad agagaarto goobaheena iyo noocyada dokumentiyada.
  • Waxaa lagu daray jid gaaban kiiboodhka goobta raadinta Ctrl + /:.

Sass

  • Waxaan ka saarnay khariidaddii Sass ee isku-darka ahayd si ay u fududaato in meesha laga saaro qiyamka dheeraadka ah. Maskaxda ku hay inaad hadda qeexdo dhammaan qiyamka ku jira khariidadaha Sass sida $theme-colors. Eeg sida loola macaamilo khariidadaha Sass .

  • JebintaShaqada dib loo magacaabay color-yiq()iyo doorsoomayaasha la xidhiidha color-contrast()maadaama aanay hadda xidhiidh la lahayn meelaynta midabka YIQ. Fiiri #30168.

    • $yiq-contrasted-thresholdwaxaa loo bedelay $min-contrast-ratio.
    • $yiq-text-darkwaxaana $yiq-text-lightloo kala beddelay magacyo $color-contrast-darkiyo $color-contrast-light.

  • JebintaSu'aalaha warbaahinta isku-darka cabbirada waxay u beddeleen hab macquul ah.

    • media-breakpoint-down()waxay isticmaashaa barta jabinta lafteeda halkii aad ka isticmaali lahayd barta jabinta soo socota (tusaale, media-breakpoint-down(lg)halkii media-breakpoint-down(md)bartilmaameedyada la beegsan lahaa ee ka yar lg).
    • Sidoo kale, halbeegga labaad ee ku jira media-breakpoint-between()wuxuu kaloo isticmaalaa barta jabinta lafteeda halkii uu ka isticmaali lahaa barta soo socota (tusaale, media-between(sm, lg)halkii la media-breakpoint-between(sm, md)beegsan lahaa meelaha u dhexeeya smiyo lg).

  • JebintaHababka daabacaadda ee meesha laga saaray iyo $enable-print-stylesdoorsoomayaasha. Fasalada bandhigga daabacaadda ayaa wali ku dhow. Fiiri #28339 .

  • JebintaLa tuuray color(), theme-color(), oo gray()u shaqeeya doorsoomayaal. Fiiri #29083 .

  • JebintaShaqada dib theme-color-level()loo magacaabay color-level()oo hadda aqbashay midab kasta oo aad rabto halkii aad ka heli lahayd $theme-colormidabyo kaliya. Fiiri #29083 Ka fiirso: color-level() ayaa markii dambe lagu tuuray v5.0.0-alpha3.

  • JebintaLa magacaabay $enable-prefers-reduced-motion-media-queryoo $enable-pointer-cursor-for-buttonsloo bixiyay $enable-reduced-motioniyo $enable-button-pointerssi kooban.

  • JebintaMeesha laga saaray bg-gradient-variant()isku darka Isticmaal .bg-gradientfasalka si aad ugu darto gradients walxaha halkii aad ka heli lahayd .bg-gradient-*fasallada la soo saaray.

  • Jebinta Waxa meesha laga saaray isku-dhafka hore ee laga saaray:

    • hover, iyo hover-focus_plain-hover-focushover-focus-active
    • float()
    • form-control-mixin()
    • nav-divider()
    • retina-img()
    • text-hide()(sidoo kale waa la tuuray fasalka utility ee la xidhiidha, .text-hide)
    • visibility()
    • form-control-focus()

  • JebintaShaqada dib loo magacaabay scale-color()si shift-color()looga fogaado isku dhaca shaqada Sass ee midabaynta u gaarka ah.

  • box-shadowmixins hadda oggolaadaan nullqiyamka iyo hoos noneka doodo badan. Fiiri #30394 .

  • Isku- border-radius()dhafka hadda wuxuu leeyahay qiime aan caadi ahayn.

Nidaamka midabka

  • Nidaamka midabka kaas oo la shaqeeyay color-level()lagana $theme-color-intervalsaaray habka midabka cusub. Dhammaan lighten()iyo darken()hawlaha ku jira codebase-kayaga waxa lagu beddelaa tint-color()iyo shade-color(). Hawlahani waxay isku dari doonaan midabka mid cad ama madow halkii ay ka beddeli lahaayeen iftiinkeeda qadar go'an. Midabku shift-color()wuu madoobayn doonaa ama hadhayaa iyadoo ku xidhan haddii cabbirka miisaankiisu yahay mid togan ama mid taban. Faahfaahin dheeraad ah ka eeg #30622 .

  • Midab kasta oo midab kasta lagu daray midabyo cusub, oo siinaya sagaal midab oo kala duwan midab kasta oo salka ah, sida doorsoomayaasha Sass cusub.

  • Kala duwanaanshaha midabka oo la hagaajiyay. Saamiga isbarbardhigga midabka jabay laga bilaabo 3:1 ilaa 4.5:1 iyo midab buluug, cagaar, cyan, iyo casaan la cusboonaysiiyay si loo hubiyo isbarbardhigga WCAG 2.1 AA. Sidoo kale midabkeena isbarbardhiga u $gray-900beddeley $black.

  • Si aan u taageerno nidaamka midabkeena, waxaan ku soo kordhinay caado tint-color()iyo shade-color()hawlo cusub si aan midabkeena ugu qasno.

Cusboonaysiinta Grid

  • Barxad cusub! Waxaa lagu daray meel cusub oo kor xxlu 1400pxkac ah. Wax is beddel ah ma jiraan dhammaan meelaha kale ee jabinta.

  • Biyo-mareennada la hagaajiyay. Gutters hadda waxa lagu dejiyay rems, oo way ka cidhiidhsan yihiin v4 ( 1.5rem, ama ku saabsan 24px, hoos 30px). Tani waxay la jaanqaadaysaa majaraha hab-mareenkayaga iyo meelaha kala dheereynta ee nootility our.

    • Lagu darey dabaq cusub ( .g-*, .gx-*, iyo .gy-*) si loo xakameeyo maroojisyada jiifka/tooska ah, maroojisyada toosan, iyo majaraha toosan.
    • JebintaWaxaa loo beddelay .no-gutterssi .g-0ay ugu habboonaato yutiilitida jeexjeexyada cusub.

  • Tiirarka hadda ma position: relativedalban, marka waxaa laga yaabaa inaad ku darto .position-relativeqaar ka mid ah walxaha si aad u soo celiso dhaqankaas.

  • JebintaHoos u dhigay dhawr .order-*fasal oo inta badan aan la isticmaalin. Hadda waxaan bixinaa oo kaliya .order-1meel .order-5ka baxsan sanduuqa.

  • JebintaLa tuuray .mediaqaybta maadaama si sahal ah loogu koobi karo yutiilitida. Fiiri #28265 tusaale ahaan bogga adeegyada flex .

  • Jebinta bootstrap-grid.csshadda kaliya waxay quseysaa box-sizing: border-boxtiirka halkii aad dib u dejin lahayd cabbirka sanduuqa caalamiga ah. Sidan, qaababka xajinta waxaa loo isticmaali karaa meelo badan iyada oo aan la faragelin.

  • $enable-grid-classesmar dambe ma curyaamiso jiilka fasalada weelka. Fiiri #29146.

  • Waxaa loo cusboonaysiiyay isku- make-coldhafka oo u dhigma tiirar siman oo aan lahayn cabbir cayiman.

Mawduuca, Dib-u-bilow, iwm

  • RFS hadda waa la furay. Ciwaanka isticmaalayafont-size()dhafka ayaa si toos ah ula qabsan doonafont-sizecabbirkooda iyadoo la eegayo muuqaalka. Sifadan waxa hore loogu gatay v4.

  • JebintaWaxa aan dib u habayn ku samaynay qoraalkayaga soo bandhigida si aanu ugu bedelno $display-*doorsoomayaashayada iyo $display-font-sizeskhariidadda Sass. Sidoo kale meesha laga saaray doorsoomayaasha shaqsiga $display-*-weightah ee hal $display-font-weightiyo habaysan font-sizes.

  • Waxaa lagu daray laba .display-*cabbir cinwaan oo cusub, .display-5iyo .display-6.

  • Xiriirinta waxaa hoosta laga xarriiqay si toos ah (ma ahan oo keliya dul heehaab), ilaa ay ka mid yihiin qaybo gaar ah mooyaane.

  • Miisaska dib loo habeeyay si loo cusboonaysiiyo qaabkooda oo dib loogu dhiso doorsoomayaal CSS si loo xakameeyo habaynta.

  • JebintaMiisaska buulka leh ma dhaxli karaan qaabab dambe.

  • Jebinta .thead-lightwaxaana .thead-darklagu tuuray door ah .table-*fasalada kala duwan ee loo isticmaali karo dhammaan walxaha miiska ( thead, tbody, tfoot, triyo th) td.

  • JebintaIsku- table-row-variant()darka waxa loo beddelay table-variant()oo aqbala 2 cabbir oo keliya: $color(magaca midabka) iyo $value(code code). Midabka xuduudka iyo midabada lahjadda si toos ah ayaa loo xisaabiyaa iyadoo lagu salaynayo doorsoomayaasha qodobka miiska.

  • U kala qaybso doorsoomayaasha suufka unugga miiska -yiyo -x.

  • Jebinta.pre-scrollableFasalka la tuuray . Fiiri #29135

  • Jebinta .text-*Utility-yada kuma darin dullimaad iyo gobollo diiradda saaraya xiriirinta mar dambe. .link-*Taa beddelkeeda fasallo caawiye ayaa la isticmaali karaa. Fiiri #29267

  • Jebinta.text-justifyFasalka la tuuray . Eeg #29793

  • Jebinta <hr>Cunsuriyada hadda waxay isticmaalaan heighthalkii borderay si wanaagsan u taageeri lahaayeen sizesifada. Tani waxay sidoo kale awood u siineysaa isticmaalka qalabka suufka si ay u abuurto kala qaybiyayaal dhumuc weyn leh (tusaale, <hr class="py-1">).

  • Dib u habeyn toos ah padding-leftiyo <ul>curiyeyaasha <ol>browser-ka default 40pxuna 2rem.

  • Lagu daray $enable-smooth-scroll, kaas oo khuseeya scroll-behavior: smoothcaalami ahaan - marka laga reebo isticmaalayaasha waydiinaya dhaqdhaqaaqa la dhimay iyada oo loo marayo prefers-reduced-motionweydiinta warbaahinta. Fiiri #31877

RTL

  • Jihada toosan doorsoomayaal gaar ah, yutiilitida, iyo isku darka dhamaantood waa la bedelay si loo isticmaalo sifooyin macquul ah sida kuwa laga helay qaab-dhismeedka flexbox- tusaale, startiyo endbeddelka leftiyo right.

Foomamka

  • Lagu daray foomam sabaynaya oo cusub! Waxaanu u dallacnay tusaalaha summadaha Sabaynta si aanu u helno qaybo qaabaysan oo si buuxda loo taageeray. Eeg bogga cusub ee sumadaha Sabaynta

  • Jebinta Qaabka qaabaysan ee wadaniga ah iyo kuwa gaarka ah. Sanduuqyada hubinta, raadiyaha, xulashada, iyo agabyada kale ee lahaa fasalada hooyo iyo kuwa caadiga ah ee v4 waa la mideeyay. Hadda ku dhawaad ​​dhammaan walxaha qaabkeenu waa kuwo caado u ah, intooda badan iyada oo aan loo baahnayn HTML caadada ah.

    • .custom-checkwaa hadda .form-check.
    • .custom-check.custom-switchwaa hadda .form-check.form-switch.
    • .custom-selectwaa hadda .form-select.
    • .custom-filewaxaana .form-filelagu bedelay qaabab caadadii dusha sare .form-control.
    • .custom-rangewaa hadda .form-range.
    • Dalkii la tuuray .form-control-fileiyo .form-control-range.

  • JebintaSoo dhacay .input-group-appendiyo .input-group-prepend. Waxaad hadda ku dari kartaa badhamada iyo .input-group-textsida carruurta tooska ah ee kooxaha wax gelinta.

  • Xaduuda soohdinta ee mudada dheer maqan ee kooxda galinta leh ee leh cillad jawaab celinta ansaxinta ayaa ugu dambeyntii la hagaajiyay iyadoo lagu darayo .has-validationfasal dheeri ah kooxaha wax gelinta leh ansaxinta.

  • Jebinta Dhigay fasalo qaabayn gaar ah oo loogu talagalay nidaamkayaga qulqulka. Isticmaal shabaqyadayada iyo adeegyadayada halkii aad ka isticmaali lahayd .form-group, .form-row, ama .form-inline.

  • JebintaCalaamadaha foomka hadda waxay u baahan yihiin .form-label.

  • Jebinta .form-textno more sets display, taasoo kuu ogolaanaysa inaad abuurto inline ama xannibi qoraalka caawinta sida aad rabto oo kaliya adiga oo bedelaya curiyaha HTML.

  • Astaamaha xaqiijinta hadda laguma dabaqo <select>s leh multiple.

  • Isha dib loo habeeyay ee faylasha Sass ee hoos yimaada scss/forms/, oo ay ku jiraan qaababka kooxda wax gelinta.

Qaybaha

  • Qiimaha midaysan paddingee digniinaha, rootida, kaadhadhka, hoos u dhaca, kooxaha liiska, moodooyinka, popovers, iyo aaladaha lagu saleeyo $spacerdoorsoomayaashayada. Fiiri #30564 .

Accordion

Digniin

  • Ogeysiisyadu hadda waxay leeyihiin tusaalayaal leh astaamo .

  • Hababka gaarka ah ee <hr>s ee laga saaray digniin kasta tan iyo markii ay hore u isticmaaleen currentColor.

Calaamadaha

  • JebintaLa tuuray dhammaan .badge-*fasallada midabka ee agabka asalka ah (tusaale, isticmaal .bg-primaryhalkii laga isticmaali lahaa .badge-primary).

  • JebintaLa tuuray .badge-pill- beddelka .rounded-pillutility isticmaal.

  • JebintaHababka foojignaanta ee laga saaray <a>iyo <button>walxaha

  • Kordhinta suufka caadiga ah ee calaamadaha laga bilaabo .25em/ .5emilaa .35em/ .65em.

  • Fududeeyay muuqaalka caadiga ah ee rootiga isagoo meesha ka saaray padding, background-color, iyo border-radius.

  • Waxaa lagu daray hanti cusub oo CSS gaar ah --bs-breadcrumb-dividersi fudud loogu habeyn karo iyada oo aan loo baahnayn in dib loo soo uruuriyo CSS.

Badhamada

  • Jebinta Beddel badhamada , sanduuqyada hubinta ama raadiyaha, uma baahna JavaScript oo waxay leeyihiin calaamado cusub. Uma baahnno curiye duuban,.btn-checkku<input>, oo ku lamaan.btnfasal kasta oo ku yaal<label>. Fiiri #30650 . Dukumiintiyada tan waxay ka guureen boggayaga Buttons waxayna u guureen qaybta foomamka cusub.

  • Jebinta Looga soo degay .btn-blockadeegyada Halkii aad ka isticmaali .btn-blocklahayd .btn, ku duub badhamadaada .d-gridiyo .gap-*utility si aad u banayso marka loo baahdo. U beddelo fasallada jawaab-celinta si aad xitaa u maamusho iyaga. U akhri dukumeentiyada tusaale ahaan.

  • La cusboonaysiiyay annaga button-variant()iyo button-outline-variant()isku darka si ay u taageeraan cabbirro dheeraad ah.

  • Badhamada la cusboonaysiiyay si loo hubiyo kala duwanaanshiyaha korodhay ee duleelka iyo gobolada firfircoon.

  • Badhamada naafada hadda waxay leeyihiin pointer-events: none;.

Kaadhka

  • JebintaHoos .card-decku dhac ku yimid shabkadayada. Ku duub kaararkaaga fasallada tiirarka oo ku dar .row-cols-*weel waalid si aad u abuurto sagxadaha kaadhka (laakin iyada oo la xakameynayo toosinta jawaabta).

  • JebintaHoos .card-columnsu dhac ku yimid dhanka Masonry. Fiiri #28922 .

  • JebintaWaxay ku bedeshay .cardaccordion ku salaysan qayb cusub oo Accordion ah .

  • .carousel-darkKala duwanaansho cusub oo lagu daray qoraalka mugdiga ah, kontaroolada, iyo tilmaamayaasha (ku fiican asalka fudud).

  • Astaamaha chevron ee lagu beddelay kontaroolada carousel oo leh SVG-yo cusub oo ka yimid Astaamaha Bootstrap .

Xir badhanka

  • JebintaWaxaa .closeloogu .btn-closemagac daray magac yar.

  • Xiritaanka badhamada hadda waxay isticmaalaan background-image(SVG-ku-xidhan) halkii ay ka ahaan &times;lahaayeen HTML-ka, taasoo u oggolaanaysa in si fudud loo habeeyo iyada oo aan loo baahnayn in la taabto calaamadayntaada.

  • Lagu daray .btn-close-whitekala duwanaansho cusub oo adeegsata filter: invert(1)si ay u suurtageliso isbarbardhigga sare ee ka saarista calaamadaha ka soo horjeeda asalka madow.

Burbur

  • Duub-duubka oo la saaray oo loogu talagalay accordions.

  • Waxaa lagu daray doorsoomayaal cusub .dropdown-menu-darkiyo doorsoomayaal laxidhiidha hoos udhaca mugdiga ah ee la rabo.

  • Doorsoome cusub oo lagu daray $dropdown-padding-x.

  • Madoobeeyay qaybiyaha hoos u dhaca si uu isbarbardhiga u fiicnaado.

  • JebintaDhammaan dhacdooyinka hoos-u-dhigga hadda waxay ku kiciyaan badhanka hoos u-dejinta ka dibna la xumbo ilaa qaybta waalidka.

  • Liiska hoos-u-dhaca hadda waxay leeyihiin data-bs-popper="static"sifo go'an marka meelaynta hoos u dhigistu ay taagan tahay iyo data-bs-popper="none"marka hoos u dhigistu ku jirto navbar. Tan waxaa ku daray JavaScript-kayaga oo waxay naga caawisaa adeegsiga qaababka booska caadiga ah annaga oo aan faragelin ku samaynayn meelaynta Popper.

  • JebintaXulashada la tuuray flipee plugin hoos u dhigista iyada oo door bideysa qaabeynta Popper-ka. Hadda waxaad joojin kartaa hab-dhaqanka rogrogmada adiga oo ka gudbaya array madhan oo ah fallbackPlacementsikhtiyaarka beddelka beddelka.

  • Menus-hoosaadka hadda waa la gujin karaa iyada oo leh autoCloseikhtiyaar cusub si loo maareeyo dabeecadda isu -dhowrka . Waxaad isticmaali kartaa ikhtiyaarkan si aad u aqbasho gujinta gudaha ama dibadda liiska hoos u dhaca si aad uga dhigto mid is dhexgal ah.

  • Hoos-u-dhacyada hadda waxay taageeraan .dropdown-items ku duudduubay <li>s.

Jumbotron

Liiska kooxda

  • Lagu daray nulldoorsoomayaal cusub font-size, font-weight, color, iyo :hover colorfasalka .nav-link.
  • JebintaNavbars hadda waxay u baahan yihiin weel gudaha ah (si aad loo fududeeyo shuruudaha kala dheereynta iyo CSS loo baahan yahay).

Offcanvas

Pagination

  • Xidhiidhiyayaasha bog-goynta hadda waxay leeyihiin wax la beddeli karo margin-leftkuwaas oo si firfircoon ugu wareegsan dhammaan geesaha marka midba midka kale ka sooco.

  • Lagu daray transitions xiriirinta boggaga

Popovers

  • JebintaDib .arrowloogu magacaabay .popover-arrowqaab-dhismeedkayaga popover ee caadiga ah.

  • Ikhtiyaarka whiteListloo allowListmagacaabay

Spinners

  • Spinners hadda waxay sharfaan prefers-reduced-motion: reduceiyagoo hoos u dhigaya animations. Fiiri #31882 .

  • Laysinka toosan ee lafdhabarta oo la hagaajiyay.

Roodhiyo

  • Toasts hadda waxa la dhigi karaa a iyada .toast-containeroo la kaashanayo meelaynta yutiilitida .

  • Waxa loo beddelay 5 ilbiriqsi.

  • Laga overflow: hiddensoo saaray rootiga rootiga oo lagu beddelay border-radiuss habboon oo leh calc()hawlo.

Tilmaamaha Qalabka

  • JebintaWaxaa .arrowloogu magac daray .tooltip-arrowqaabka caadiga ah ee qalabkayaga.

  • JebintaQiimaha caadiga ah ee loogu talagalay fallbackPlacementswaxaa loo beddelaa ['top', 'right', 'bottom', 'left']meeleyn ka sii wanaagsan ee walxaha popper.

  • JebintaIkhtiyaarka whiteListloo allowListmagacaabay

Utility

  • JebintaWaxaa loo magacaabay adeegyo dhowr ah si ay u isticmaalaan magacyada hantida macquulka ah halkii ay ka isticmaali lahaayeen magacyada jihaynta iyadoo lagu daray taageerada RTL:

    • La magacaabay .left-*iyo .right-*ku .start-*iyo iyo .end-*.
    • La magacaabay .float-leftiyo .float-rightku .float-startiyo iyo .float-end.
    • La magacaabay .border-leftiyo .border-rightku .border-startiyo iyo .border-end.
    • La magacaabay .rounded-leftiyo .rounded-rightku .rounded-startiyo iyo .rounded-end.
    • La magacaabay .ml-*iyo .mr-*ku .ms-*iyo iyo .me-*.
    • La magacaabay .pl-*iyo .pr-*ku .ps-*iyo iyo .pe-*.
    • La magacaabay .text-leftiyo .text-rightku .text-startiyo iyo .text-end.

  • JebintaNaafada xad-dhaafka ah sida caadiga ah.

  • Lagu soo daray .bg-bodyfasal cusub si dhakhso ah loogu dejiyo <body>asalka walxaha dheeraadka ah.

  • Waxaa lagu daray boos cusub oo loogu talagalay top, right, bottom, iyo left. Qiimaha waxaa ku jira 0, 50%, iyo 100%hanti kasta.

  • Lagu daray cusub .translate-middle-x& .translate-middle-yyutiilitooyin si toosan ama toosan udub dhexaadka u ah curiyayaasha meelaysan ee qumman.

  • Lagu daray border-widthyutiilitida cusub

  • JebintaLoo .text-monospacemagacaabay .font-monospace.

  • JebintaLa saaray .text-hidemaadaama ay tahay hab qadiimi ah oo lagu qariyo qoraalka oo ay tahay inaan mar dambe la isticmaalin.

  • .fs-*Utility- yada lagu daray font-size(oo leh RFS) Kuwani waxay isticmaalaan miisaan la mid ah cinwaannada HTML ee caadiga ah (1-6, weyn ilaa yar), waxaana lagu beddeli karaa khariidadda Sass.

  • JebintaUtilities dib loo magacaabay .font-weight-*sida .fw-*soo koobida iyo joogteynta

  • JebintaUtilities dib loo magacaabay .font-style-*sida .fst-*soo koobida iyo joogteynta

  • Lagu darey .d-gridsi ay u soo bandhigaan utility iyo gapyutiilitooyinka cusub ( .gap) ee CSS Grid iyo qaabeynta flexbox.

  • JebintaLaga saaray .rounded-smiyo rounded-lg, oo soo bandhigay miisaan cusub oo fasallo ah, .rounded-0si .rounded-3. Fiiri #31687 .

  • Lagu daray line-heightyutiilitida cusub: .lh-1, .lh-sm, .lh-baseiyo .lh-lg. Halkan ka daawo .

  • U dhaqaajiyay .d-noneutility-ga CSS-kayaga si aanu uga siino miisaan ka badan agabka kale ee bandhigga.

  • Kordhinta .visually-hidden-focusablecaawiyaha si uu sidoo kale uga shaqeeyo weelasha, isagoo isticmaalaya :focus-within.

Caawiyeyaal

  • Jebinta Caawiyeyaasha isku duuban ee wax ka qabata ayaa lagu bedelay magaca caawiyayaasha saamiga ee leh magacyo cusub iyo dabeecado horumarsan, iyo sidoo kale doorsoome CSS ah oo waxtar leh.

    • Fasallada waxaa loo beddelay si loogu beddelo bysaamiga xdhinaca. Tusaale ahaan, .ratio-16by9hadda waa .ratio-16x9.
    • Waxaan hoos u dhignay xuliyihii kooxda .embed-responsive-itemiyo curiye si aan u door bidno mid fudud oo .ratio > *doorta. Fasal dheeraad ah looma baahna, caawiyaha saamiga hadda wuxuu la shaqeeyaa shay kasta oo HTML ah.
    • Khariidadda $embed-responsive-aspect-ratiosSass waa loo beddelay $aspect-ratiosoo qiyamkeeda waa la fududeeyay si loogu daro magaca fasalka iyo boqolleyda sida key: valuelammaanaha.
    • Doorsoomayaasha CSS hadda waa la soo saaray oo lagu daray qiime kasta oo ku jira khariidadda Sass. Wax ka --bs-aspect-ratiobeddel doorsoomaha dusha .ratiosi aad u abuurto saami kasta oo caado ah .

  • Jebinta Fasalada "Reader Screen" hadda waa fasalo "muuqaal qarsoon" .

    • scss/helpers/_screenreaders.scssWaxa uu ka beddelay faylka Sassscss/helpers/_visually-hidden.scss
    • Magacaabis .sr-onlyiyo .sr-only-focusablein loo .visually-hiddenmagacaabo.visually-hidden-focusable
    • La magacaabay sr-only()oo sr-only-focusable()isku daraya visually-hidden()iyo visually-hidden-focusable().

  • bootstrap-utilities.cssHadda waxa kale oo ku jira caawiyayaashayada. Caawiyeyaashu uma baahna in lagu soo dejiyo dhismayaal khaas ah.

JavaScript

  • Ku-tiirsanaanta jQuery waa la tuuray oo dib-u-qoray plugins si ay ugu jiraan JavaScript-ka caadiga ah.

  • JebintaSifooyinka xogta ee dhammaan plugins-yada JavaScript hadda waa la magacaabay si ay u caawiyaan kala soocidda shaqeynta Bootstrap ee dhinacyada saddexaad iyo koodkaaga. Tusaale ahaan, waxaan isticmaalnaa data-bs-togglehalkii data-toggle.

  • Dhammaan plugins hadda waxay aqbali karaan xulashada CSS inay tahay doodda koowaad. Waxaad ka gudbi kartaa walxaha DOM ama doore kasta oo CSS ah oo sax ah si aad u abuurto tusaale cusub oo plugin ah:

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

  • popperConfigwaxaa loo gudbin karaa shaqo ahaan aqbala Bootstrap's default Popper config ahaan dood ahaan, si aad ugu milmaan habkan caadiga ah ee habkaaga. Waxay qusaysaa hoos-u-dhacyada, popovers, iyo qalabyada.

  • Qiimaha caadiga ah ee loogu talagalay fallbackPlacementswaxaa loo beddelaa ['top', 'right', 'bottom', 'left']meeleyn ka fiican ee walxaha Popper. Waxay qusaysaa hoos-u-dhacyada, popovers, iyo qalabyada.

  • Hoosta laga saaray hababka dawliga ah sida _getInstance()→ getInstance().