Tɛmɛn ka taa kunnafoni kunbabaw la Tɛmɛn ka taa docs navigation kan
in English

Migrating ka taa v5 la

Yɛlɛma minnu kɛra Bootstrap source files, documentation ani components kɔnɔ, olu nɔfɛ ani ka u lajɛ walasa k’i dɛmɛ ka bɔ v4 la ka taa v5 la.

Dependencies (Jɛkuluw).

  • A ye jQuery bila.
  • A bɛ wuli ka bɔ Popper v1.x la ka taa Popper v2.x la.
  • A ye Libsass bila Dart Sass nɔ na i n'a fɔ an ka Sass compiler min dira Libsass ma o tun bɛ baara la.
  • A bɔra Jekyll ka taa Hugo an ka sɛbɛnw jɔli kosɔn

Navigatɛri dɛmɛni

  • A ye Internet Explorer 10 ani 11 bila
  • Microsoft Edge < 16 (Edge kɔrɔlen) bɔra a la.
  • Firefox < 60 bɔra a la
  • Safari jiginna < 12
  • A ye iOS Safari < 12 bɔ
  • Chrome min bɛ jigin < 60

Sɛbɛnw bɛ fɛn caman Changer

  • A daminɛna, sɛbɛnw labɛncogo ani a jukɔrɔla yɔrɔ labɛnna kokura.
  • A ye Parsela gafe kura fara a kan .
  • A ye Customize yɔrɔ kura fara a kan , ka v4 ka Theming ɲɛ bila a nɔ na , ni kunnafoni kuraw ye Sass kan, diɲɛ kɔnɔ sigicogo suganditaw, kulɛriw, CSS fɛn caman sɛgɛsɛgɛli, ani fɛn wɛrɛw.
  • A ye sɛbɛnw bɛɛ labɛn kokura ka kɛ Sɛbɛnw yɔrɔ kura ye , ka kɔnɔkow tila ka kɛ ɲɛw ye minnu sinsinnen don kosɛbɛ.
  • O cogo kelen na, Layout yɔrɔ kura ye , walasa ka grid kɔnɔkow farikolo jira ka jɛya.
  • A tɔgɔ jiginna “Navs” yɔrɔ ɲɛ kan ka kɛ “Navs & Tabs” ye.
  • A tɔgɔ jiginna “Checks” ɲɛ kan ka kɛ “Checks & radios” ye.
  • A ye navbar labɛn kokura ani ka subnav kura dɔ fara a kan walasa ka nɔgɔya don an ka sitew ni docs versions lamini na.
  • Klaviyeti surun kura farala ɲinini yɔrɔ kan: Ctrl + /.

Sass ye

  • An ye Sass map merges default ditched walasa ka nɔgɔya don nafalanw bɔli la. Aw k' a to aw hakili la sisan aw ka kan ka nafa bɛɛ ɲɛfɔ Sass karitiw kɔnɔ i n' a fɔ $theme-colors. Aw ye Sass kartiw kunbɛncogo lajɛ .

  • Ka kariTɔgɔ wɛrɛ Kɛra color-yiq()baarakɛcogo ni a ɲɔgɔnna fɛn caman na ka Kɛ color-contrast()i n'a fɔ a tɛ tali Kɛ YIQ kulɛri-yɔrɔ la tugun. Aw ye #30168 lajɛ.

    • $yiq-contrasted-thresholdbɛ tɔgɔ caman wɛrɛ da $min-contrast-ratio.
    • $yiq-text-darkani $yiq-text-lightu tɔgɔ caman bɛ wuli ka kɛ $color-contrast-darkani $color-contrast-light.
  • Ka kariMedia query mixins paramètres ye fɛn caman Changé walasa ka fɛɛrɛ sɔrɔ min bɛ bɛn hakili ma.

    • media-breakpoint-down()bɛ baara kɛ ni kariyɔrɔ yɛrɛ ye kariyɔrɔ nata nɔ na (misali la, media-breakpoint-down(lg)sanni ka media-breakpoint-down(md)laɲiniw filɛlifɛnw ka dɔgɔ ni lg).
    • O cogo kelen na, paramɛtɛrɛ filanan in media-breakpoint-between()fana bɛ baara Kɛ ni kariyɔrɔ yɛrɛ ye kariyɔrɔ nata nɔ na (misali la, laɲiniw filɛliyɔrɔw media-between(sm, lg)nɔ na ani ).media-breakpoint-between(sm, md)smlg
  • Ka kariA bɔra sɛbɛnni kɛcogoyaw ni $enable-print-stylesfɛn caman sɛgɛsɛgɛli la. Print display classes bɛ yen hali bi. Aw ye #28339 lajɛ .

  • Ka kariDropped color(), theme-color(), ani gray()functions ka ɲɛsin variables ma. Aw ye #29083 lajɛ .

  • Ka kariRenamed theme-color-level()function to color-level()ani sisan a bɛ sɔn kulɛri o kulɛri ma i b’a fɛ sanni ka kɛ $theme-colorkulɛriw dɔrɔn ye. Aw ye #29083 lajɛ : color-level() a kɛra kɔfɛ ka bila v5.0.0-alpha3.

  • Ka kariTɔgɔ kura donna $enable-prefers-reduced-motion-media-queryani $enable-pointer-cursor-for-buttonska taa $enable-reduced-motionani $enable-button-pointerska surunya.

  • Ka kariA ye bg-gradient-variant()mixin bɔ. Baara kɛ ni .bg-gradientkalasi ye walasa ka gradients (gradients) fara elements (daɲɛw) kan sanni ka .bg-gradient-*classes (kalanso) minnu bɛ sɔrɔ.

  • Ka kari Mixin minnu tun ma deli ka kɛ fɔlɔ, olu bɔra:

    • hover, hover-focus, plain-hover-focus, anihover-focus-active
    • float()
    • form-control-mixin()
    • nav-divider()
    • retina-img()
    • text-hide()(a fana ye nafabɔ-kalasi min bɛ tali kɛ a la, o bɔ yen, .text-hide)
    • visibility()
    • form-control-focus()
  • Ka kariTɔgɔ scale-color()wɛrɛ da baarakɛcogo kan walasa shift-color()ka Sass yɛrɛ ka kulɛri sɛgɛsɛgɛli baarakɛcogo bali ka ɲɔgɔn sɔrɔ.

  • box-shadowmixins sisan bɛ sira di nullnafaw ma ani ka jigin noneka bɔ dalilu caman na. Aw ye #30394 lajɛ .

  • Mixin border-radius()sisan bɛ ni default value ye.

Kulɛriw sigicogo

  • Kulɛri siratigɛ min ye baara Kɛ ni color-level()ani $theme-color-intervala Bɔra ka Kɛ kulɛri kura sigicogo nɔfɛ. Bɛɛ lighten()ni darken()baarakɛcogo minnu bɛ an ka codebase kɔnɔ olu bɛ bila u nɔ na ni tint-color()ani shade-color(). O baara ninnu bɛna kulɛri ɲagami ni finman walima nɛrɛmuguma ye sanni k’a nɔgɔya caman Changer ni hakɛ latigɛlen ye. A shift-color()bɛna kulɛri dɔ tin walima ka a bonya ka kɛɲɛ ni a girinya paramɛtiri ye ko ɲuman ye walima ko jugu ye. Aw ye #30622 lajɛ walasa ka kunnafoni wɛrɛw sɔrɔ .

  • A ye tintin ni biɲɛ kura fara a kan kulɛri kelen-kelen bɛɛ la, ka kulɛri danfaralen kɔnɔntɔn di basigi kulɛri kelen-kelen bɛɛ ma, i n’a fɔ Sass fɛn kuraw.

  • Kulɛriw danfara ɲɛnabɔra. Kulɛri danfara hakɛ min bɛ bugɔ ka bɔ 3:1 na ka se 4,5:1 ma ani kulɛri bulu, wuluwulu, siyan ani pinki kurayali walasa ka WCAG 2.1 AA danfara sabati. Fana an ye an ka kulɛri danfara kulɛri Changé ka bɔ $gray-900ka taa $black.

  • Walasa k’an ka kulɛriw sigicogo dɛmɛ, an ye laadalakow tint-color()ni shade-color()baarakɛcogo kura dɔw fara a kan walasa k’an ka kulɛriw ɲagami ka ɲɛ.

Grid kurayali

  • Breakpoint kura! xxlA ye breakpoint kura fara a kan 1400pxka taa san fɛ. Yɛlɛma si ma kɛ kariyɔrɔ tɔw bɛɛ la.

  • Gutters (jibolisiraw) minnu ɲɛnabɔra. Sisan, gutɛriw bɛ sigi rems kɔnɔ, wa u ka surun ka tɛmɛ v4 kan ( 1.5rem, walima 24px, ka jigin ka bɔ 30px). O b’a to an ka grid system ka gutters ni an ka spacing utilities bɛ bɛn ɲɔgɔn ma.

    • A ye jibolisiraw kalasi kura ( .g-*, .gx-*, ani .gy-*) fara a kan walasa ka jibolisiraw jɔlenw/jiginnenw, jibolisiraw jɔlenw, ani jibolisiraw jɔlenw kɔlɔsi.
    • Ka kariA tɔgɔ jiginna .no-gutterska kɛ walasa .g-0ka bɛn gutter utilities kura ma.
  • Kolonw ma position: relativebaara Kɛ tugun, o la, i bɛ Se ka dɔ Fàra .position-relativefɛn dɔw kan walasa k’o kɛcogo Lasegin.

  • Ka kariA ye kalan damadɔw bila .order-*minnu tun bɛ to ka taa baara tɛ kɛ ni minnu ye. An bɛ sisan dɔrɔn de di .order-1ka .order-5bɔ kɛsu kɔnɔ.

  • Ka kariA ye .mediacomponent (yɔrɔ) Dòn i n'a fɔ a bɛ Se ka Lasegin nɔgɔya la ni utilités (nafamafɛnw) ye. aw ye #28265 ani flex utilities ɲɛ lajɛ misali la .

  • Ka kari bootstrap-grid.csssisan a bɛ tali box-sizing: border-boxkɛ kulu dɔrɔn de la sanni ka diɲɛ kɛsu-taamacogo lasegin. O cogo la, an ka grid styles bɛ se ka baara kɛ yɔrɔ caman na k’a sɔrɔ u ma dankari kɛ.

  • $enable-grid-classestɛ minɛnko kalanw bɔli bali tugun. Aw ye #29146 lajɛ.

  • A ye make-colmixin kuraya ka kɛ default ye ka kɛɲɛ ni kuluw ye minnu hakɛ ma fɔ.

Kɔnɔkow, Reboot, a ɲɔgɔnnaw

  • RFS bɛ baara kɛ sisan ka kɛɲɛ ni a daminɛ ye. Kumakun minnu bɛ baara kɛ nifont-size()mixin ye, olu bɛna u yɛrɛ ladilanfont-sizeka kɛɲɛ ni jatebɔlan ye. O fɛɛrɛ in tùn ye opt-in ye ni v4 ye fɔlɔ.

  • Ka kariA ye an ka jiralan sɛbɛnnibolow labɛn kokura walasa k’an ka $display-*fɛn caman sɛmɛntiyalenw bila u nɔ na ani ka $display-font-sizesSass karti dɔ bila u nɔ na. Fana a ye $display-*-weightbεnkan kelen-kelenw Bɔ s kelen na $display-font-weightani s ladilanen font-size.

  • .display-*A ye barokun hakɛ kura fila fara a kan, .display-5ani .display-6.

  • Jɛɲɔgɔnya bɛ 'jyɛn 'kɔnɔ (a tɛ Kɛ 'yɔrɔ la dɔrɔn), fo n'u ye 'yɔrɔ kɛrɛnkɛrɛnnenw ye.

  • Tabali minnu labɛnna kokura walasa k’u ka cogoyaw labɛn kokura ani k’u jɔ kokura ni CSS fɛn caman sɛgɛsɛgɛli ye walasa ka se ka u ka cogoyaw mara kosɛbɛ.

  • Ka kariTabali minnu bɛ sigi sen kan, olu tɛ cogoyaw ciyɛn ta tugun.

  • Ka kari .thead-lightani .thead-darku bɛ fili ka ɲɛsin .table-*kalasi suguya caman ma minnu bɛ se ka baara kɛ ni tabali kɔnɔfɛnw bɛɛ ye ( thead, tbody, tfoot, tr, thani td).

  • Ka karitable-row-variant()Mixin tɔgɔ bɛ Yɛlɛma ka Kɛ table-variant()ani a bɛ Sɔn paramɛtɛrɛ 2 dɔrɔn ma: $color(kulɛri tɔgɔ) ani $value(kulɛri kode). Dankan kulɛri ni fɔcogo kulɛriw bɛ jate u yɛrɛma ka da tabali factor variables (tabali factor variables) kan.

  • Tabali selilɛri padding variables tila ka kɛ -yani -x.

  • Ka kariKalanso bilala .pre-scrollable. Aw ye #29135 lajɛ

  • Ka kari .text-*nafamafɛnw tɛ hover ni focus states fara links kan tugun. .link-*dɛmɛbagaw ka kalanw bɛ se ka kɛ o nɔ na. Aw ye #29267 lajɛ

  • Ka kariKalanso bilala .text-justify. Aw ye #29793 lajɛ

  • Segin default horizontal padding-lefton <ul>ani <ol>elements ka bɔ browser default 40pxla ka taa 2rem.

  • A farala a kan $enable-smooth-scroll, min bɛ tali kɛ scroll-behavior: smoothdiɲɛ fan bɛɛ la—n’a ma fɔ baarakɛlaw ye minnu bɛ lamaga dɔgɔya ɲini prefers-reduced-motionkunnafonidilanw ɲinini fɛ. Aw ye #31877 lajɛ

RTL ye

  • Horizontal direction specific variables, utilities, ani mixins bɛɛ tɔgɔ jiginna walasa ka baara kɛ ni logical properties ye i n’a fɔ minnu bɛ sɔrɔ flexbox layouts kɔnɔ—misali la , startani ani .endleftright

Sɛbɛnw

  • Formulaire flottant kura farala a kan! An ye Floating labels misali lafasa ka se foroko yɔrɔw ma minnu bɛ dɛmɛ dafalen na. Aw ye sɛbɛn ɲɛ kura lajɛ min tɔgɔ ye ko Floating labels.

  • Ka kari Native ani custom form elements (fɔcogo nafamaw) jɛlenw. Jateblaw, arajow, sugandiliw, ani donnafɛn wɛrɛw minnu tun bɛ ni native ani custom classes ye v4 kɔnɔ, olu faralen don ɲɔgɔn kan. Sisan an ka foroko kɔnɔfɛnw bɛɛ bɛ Se ka Kɛ ladamu ye pewu, u fanba tɛ mago ɲɛ HTML ladamulen na.

    • .custom-checkye sisan .form-check.
    • .custom-check.custom-switchye sisan .form-check.form-switch.
    • .custom-selectye sisan .form-select.
    • .custom-fileani .form-fileu bilala laada cogoyaw nɔ na sanfɛ .form-control.
    • .custom-rangeye sisan .form-range.
    • Jiginna native .form-control-fileani .form-control-range.
  • Ka kariA binna .input-group-appendani .input-group-prepend. Aw bɛ se sisan ka butɔni dɔrɔn fara a kan ani .input-group-texti n’a fɔ donnajɛkuluw ka denw tilennen.

  • Missing border radius min bɛ yen kabini tuma jan donna kulu kan ni validation feedback bug ye, o laban bɛ Labɛn ni kalasi wɛrɛ farali .has-validationye donna kuluw kan ni validation ye.

  • Ka kari A ye foroko kɛrɛnkɛrɛnnenw labɛncogo kalanw bila an ka grid system (jatebɔlan) kama. Baara kɛ ni an ka grid ni utilités ye .form-group, .form-row, walima .form-inline.

  • Ka kariForoko labeliw bɛ ɲini sisan .form-label.

  • Ka kari .form-textno longer sets display, o b’a to i bɛ se ka dɛmɛ sɛbɛn inline walima block block kɛ i n’a fɔ i b’a fɛ cogo min na HTML yɔrɔ caman cili dɔrɔn fɛ.

  • Validation icons tɛ baara kɛ tugun <select>s ni multiple.

  • Labɛnna kokura source Sass files jukɔrɔ scss/forms/, donna kulu cogoyaw fana sen bɛ o la.


A yɔrɔw

  • Nafa kelenw paddingka ɲɛsin lasɔminiw, buruburuw, kartiw, fɛnw jiginni, lisi kuluw, modaliw, popoverw, ani baarakɛminɛnw ma walasa ka sinsin an ka $spacerfɛn caman sɛgɛsɛgɛli kan. Aw ye #30564 lajɛ .

Akordeyɔn

Kɔlɔsiliw

Badgew (Badges).

  • Ka kari.badge-*A ye kulɛri kalasi bɛɛ bila kɔfɛ nafalanw kama (misali la, baara kɛli kɛ .bg-primarya nɔ na .badge-primary).

  • Ka kariDropped .badge-pill— baara kɛ ni .rounded-pillutilité ye o nɔ na.

  • Ka kariA bɔra hover ni focus styles for <a>ani <button>elements.

  • dɔ farala badge default padding kan ka bɔ .25em/ .5emla ka taa .35em/ .65emla .

  • buruburuw cogoya fɔlɔ nɔgɔyara ni padding, background-color, ani border-radius.

  • CSS ladamucogo kura farala a kan --bs-breadcrumb-dividerwalasa ka ladamu nɔgɔya k’a sɔrɔ a ma kɛ wajibi ye ka CSS lajɛ kokura.

Butɔnw

  • Ka kari Toggle buttons , ni checkboxes walima arajow ye, olu tɛ JavaScript wajibiya tugun ani markup kura bɛ u la. An tɛ fɛn dɔ wajibiya tugun min bɛ kɛ ka fɛnw siri, ka fara ,.btn-checkk’a<input>ɲɔgɔn kan ni kalan suguya o.btnsuguya ye<label>. Aw ye #30650 lajɛ . O kama docs bɔra an ka Buttons ɲɛ kan ka taa Formulaire yɔrɔ kura la.

  • Ka kari A filila .btn-blockka ɲɛsin utilités ma. Sanni i ka baara .btn-block.btnni . Aw bɛ wuli ka taa kalanw la minnu bɛ jaabi di walasa ka se ka u yɛrɛ minɛ kosɛbɛ. Aw ye docs kalan walasa ka misali dɔw sɔrɔ..d-grid.gap-*

  • Updated our button-variant()ani button-outline-variant()mixins ka dɛmɛ don paramɛtɛrɛ wɛrɛw la.

  • Butɔnw kurayali walasa ka dɔ fara danfara kan hover ani active states kan.

  • Butɔn minnu ye baarakɛbaliw ye sisan , olu bɛ pointer-events: none;.

Karti

  • Ka kariA jiginna .card-deckka ɲɛsin an ka grid ma. Aw bɛ aw ka kartiw siri kulu kalanw kɔnɔ ani ka bangebaga .row-cols-*minɛn dɔ fara a kan walasa ka karti dekiw dilan kokura (nka ni aw bɛ se ka kunnafoni caman sɔrɔ jaabiw labɛncogo kan).

  • Ka kariA binna .card-columnska ɲɛsin Masonry ma. Aw ye #28922 lajɛ .

  • Ka karia ye accordion .cardbasigilen bila a nɔ na ni Accordion yɔrɔ kura ye .

  • A ye fɛn kura .carousel-dark fara a kan sɛbɛnni dibimanw, kunnafonidiw, ani taamasiyɛnw kama (a ka ɲi kosɛbɛ kɔkanna jɛlenw kama).

  • chevron taamasiyɛnw bilala karɔsili kunkankow nɔ na ni SVG kura ye ka bɔ Bootstrap taamasiyɛnw na .

Butɔn da tugu

  • Ka kariA tɔgɔ jiginna .closeka .btn-closekɛ tɔgɔ ye min tɛ caman ye.

  • Butɔnw dadonni bɛ baara Kɛ sisan ni a background-image(SVG min bɛ Dòn a la) Kɛ a nɔ na &times;HTML kɔnɔ, o bɛ sira Di mɔgɔw ma minnu bɛ Se ka Labɛn nɔgɔya la k’a sɔrɔ i ma maga i ka taamaʃyɛn na.

  • A ye fɛn kura dɔ fara a kan .btn-close-whitemin bɛ baara kɛ ni filter: invert(1)a ye walasa ka se ka danfara caman bɔ taamasiyɛnw na ka ɲɛsin dibi kɔkannakow ma.

Ka bin

  • A ye scroll anchoring bɔ acordionw kama.
  • A ye fɛn kura dɔw fara a kan .dropdown-menu-darkani fɛn caman ɲɔgɔnna minnu bɛ tali kɛ dibi la.

  • A ye fɛn kura dɔw fara a kan ka ɲɛsin $dropdown-padding-x.

  • A ye dibi don dropdown divider la walasa ka danfara ɲɛ.

  • Ka kariKo minnu bɛ Kɛ 'sènfɛ-sɛbɛnni na olu bɛɛ bɛ Daminɛ sisan 'sènfɛ-sɛbɛnni-butɔni kan ka sɔrɔ ka bugun fo ka Se bangebaga-yɔrɔ ma.

  • Sisan, 'fɛn minnu bɛ Dòn 'kɔnɔ, olu bɛ ni 'fɛn dɔ ye data-bs-popper="static"min bɛ Se ka Kɛ ni 'yɔrɔ bɛ 'yɔrɔ la min bɛ 'yɔrɔ la ani data-bs-popper="none"ni 'yɔrɔ bɛ navbar (navbar) kɔnɔ. O bɛ Fàra o kan an ka JavaScript fɛ ani k’an Dɛmɛ ka baara Kɛ ni jɔyɔrɔfalen-falen-cogow ye k’a sɔrɔ an ma Popper ka jɔyɔrɔfalen-falen-falen Kɛ.

  • Ka kariA bɔra flipsugandili la ka ɲɛsin dropdown plugin ma min bɛ Popper native configuration nafa. Sisan i bɛ se ka flipping kɛcogo bali ni i ye array lankolon dɔ tɛmɛ for fallbackPlacementsoption in flip modifier kɔnɔ.

  • sisan menu minnu bɛ jigin , olu bɛ se ka digi ni autoClosesugandi kura ye walasa ka auto close kɛcogo ɲɛnabɔ . I bɛ se ka baara kɛ ni nin sugandi in ye walasa ka sɔn ka digi yɔrɔ la min bɛ yɔrɔ la walima a kɔkan walasa a ka kɛ fɛn ye min bɛ se ka kɛ ɲɔgɔn fɛ.

  • Dropdowns sisan bɛ .dropdown-items dɛmɛ min sirilen bɛ <li>s la.

Jumbotron ye

Lisiti kulu

  • nullA ye fɛn kura dɔw fara font-size, font-weight, color, ani :hover colorkan .nav-linkkalan na.
  • Ka kariNavbarw bɛ minɛn dɔ de wajibiya sisan kɔnɔna na (walasa ka yɔrɔjan ɲininiw nɔgɔya kosɛbɛ ani CSS wajibiyalenw).

Offcanvas ye

Ɲɛjirali sɛbɛnw

  • Pagenation links sisan bɛ customizable margin-leftminnu bɛ dynamiquement rounded kan corner bɛɛ kan ni u faralen don ɲɔgɔn kan.

  • A transitionye s fara ɲɛɲiniw kan.

Popovers (Popovers) ye

  • Ka kariA tɔgɔ jiginna .arrowka .popover-arrowkɛ an ka popover template default kɔnɔ.

  • Tɔgɔ caman tigɛra whiteListsugandili la ka kɛ allowList.

Fɛnɲɛnɛmaw

  • Spinners bɛ bonya sisan prefers-reduced-motion: reduceni animations (animasiyɔnw) sumaya ye. Aw ye #31882 lajɛ .

  • A ka fisa ni spinner vertical alignment ye.

Tositiw bɛ kɛ

  • tositiw bɛ se ka bila sisan a kɔnɔ ni jɔyɔrɔfalen nafamafɛnw.toast-container dɛmɛ ye .

  • Tositi kuntaala dafalen Changé ka kɛ segin 5 ye.

  • A bɛ bɔ tobilikɛminɛnw na ka a bila a nɔ na ni s overflow: hiddenbɛnnenw ye ni baarakɛcogo ye.border-radiuscalc()

Baarakɛminɛnw ladilikanw

  • Ka kariTɔgɔ .arrowkura .tooltip-arrowdonna an ka baarakɛminɛnw jatebɔsɛbɛn kɔnɔ.

  • Ka kariNafa min bɛ sɔrɔ o la, fallbackPlacementso bɛ Changé ka ['top', 'right', 'bottom', 'left']kɛ walasa ka popper elements bila ka ɲɛ.

  • Ka kariTɔgɔ caman tigɛra whiteListsugandili la ka kɛ allowList.

Nafamafɛnw

  • Ka kariA ye nafa caman tɔgɔ caman sɛmɛntiya walasa ka baara kɛ ni logical property tɔgɔw ye sira tɔgɔw nɔ na ni RTL dɛmɛ faralen ye a kan:

    • Tɔgɔ kura donna .left-*ani .right-*ka taa .start-*ani .end-*.
    • Tɔgɔ kura donna .float-leftani .float-rightka taa .float-startani .float-end.
    • Tɔgɔ kura donna .border-leftani .border-rightka taa .border-startani .border-end.
    • Tɔgɔ kura donna .rounded-leftani .rounded-rightka taa .rounded-startani .rounded-end.
    • Tɔgɔ kura donna .ml-*ani .mr-*ka taa .ms-*ani .me-*.
    • Tɔgɔ kura donna .pl-*ani .pr-*ka taa .ps-*ani .pe-*.
    • Tɔgɔ kura donna .text-leftani .text-rightka taa .text-startani .text-end.
  • Ka kariMarge négatifs (Marges négatifs) balilen don ka kɛɲɛ ni default ye.

  • Kalanso kura farala a kan walasa ka 's kɔkanna .bg-bodysigi teliya la ka kɛ fɛn wɛrɛw ye.<body>

  • A ye jɔyɔrɔ nafamafɛn kura fara a kan top, right, bottom, ani left. Nafaw bɛ 0, 50%, ani 100%nafolo kelen-kelen bɛɛ la.

  • A ye kura .translate-middle-x& .translate-middle-ynafamafɛnw fara a kan ka ɲɛsin horizontalement walima vertically center absolute/fixed positioned elements ma.

  • border-widthNafamafɛn kura dɔw farala a kan .

  • Ka kariA tɔgɔ jiginna .text-monospaceka kɛ .font-monospace.

  • Ka kariA Bɔra .text-hidebari a ye fɛɛrɛ kɔrɔlen ye sɛbɛnni dogo la min man kan ka Kɛ tugun.

  • Nafalanw farala .fs-*nafalanw font-sizekan (ni RFS bɛ baara la). Olu bɛ baara Kɛ ni sɛgɛsɛgɛli kelen ye ni HTML ka dakun fɔlɔw ye (1-6, belebele ka Taa fitinin), wa u bɛ Se ka Lakodɔn Sass karti fɛ.

  • Ka kariNafamafɛnw tɔgɔ caman tigɛra .font-weight-*i n’a fɔ .fw-*a surunyali ni a bɛnkan.

  • Ka kariNafamafɛnw tɔgɔ caman tigɛra .font-style-*i n’a fɔ .fst-*a surunyali ni a bɛnkan.

  • A farala a kan .d-gridwalasa ka nafalanw jira ani nafalan kuraw gap( .gap) CSS Grid ani flexbox layidu talenw kama.

  • Ka kariA bɔra .rounded-smani rounded-lg, ka kalan hakɛ kura dɔ don a kɔnɔ, .rounded-0ka .rounded-3. Aw ye #31687 lajɛ .

  • Nafamafɛn kura dɔw farala a kan line-height: .lh-1, .lh-sm, .lh-baseani .lh-lg. Aw ye a lajɛ yan .

  • A ye .d-nonenafalan in wuli an ka CSS kɔnɔ walasa ka girinya caman di a ma ka tɛmɛ jiralan nafamafɛn tɔw kan.

  • A ye dɛmɛbaga janya .visually-hidden-focusableka baara kɛ fana minɛnw kan, ka baara kɛ ni :focus-within.

Dɛmɛbagaw

  • Ka kari Jaabi embed dɛmɛbagaw tɔgɔ jiginna ka kɛ ratio dɛmɛbagaw ye ni kala tɔgɔ kuraw ye ani kɛcogo ɲumanw, ka fara CSS fɛn caman sɛgɛsɛgɛli kan.

    • Kalansow tɔgɔ jiginna ka Changé byka xkɛ in aspect ratio ye. Misali la, .ratio-16by9ye sisan .ratio-16x9.
    • An ye .embed-responsive-itemani element kulu sugandili Blà ka ɲɛsin sugandili nɔgɔman dɔ .ratio > *ma. Kalanso wɛrɛ mago tɛ yen, wa ratio dɛmɛbaga bɛ baara kɛ sisan ni HTML fɛn o fɛn ye.
    • Sass karti tɔgɔ $embed-responsive-aspect-ratiosjiginna ka kɛ $aspect-ratiosa nafaw nɔgɔyara walasa ka kalasi tɔgɔ ni kɛmɛsarada la don a la i n’a fɔ key: valuefila.
    • CSS bεε bε bεn sisan ka bεn nafa kelen-kelen bɛɛ ma Sass karti kɔnɔ. fɛn --bs-aspect-ratiocaman b' a la ka.ratio fɛn caman sɛmɛntiya .
  • Ka kari “Screen reader” kalanw ye sisan “yecogo dogolenw” kalanw ye .

    • A ye Sass filen Changé ka bɔ scss/helpers/_screenreaders.scsska taascss/helpers/_visually-hidden.scss
    • Tɔgɔ kura donna .sr-onlyani .sr-only-focusableka kɛ .visually-hiddenani.visually-hidden-focusable
    • Tɔgɔ kura donna sr-only()ani sr-only-focusable()mixins ka kɛ visually-hidden()ani visually-hidden-focusable().
  • bootstrap-utilities.csssisan, an dɛmɛbagaw fana sen bɛ o la. Dɛmɛbagaw mago tɛ ka don ladamu jɔli la tugun.

JavaScript ye

  • A ye jQuery dependency bila ka plugins sɛbɛn kokura walasa u ka kɛ JavaScript basigilen kɔnɔ.

  • Ka kariJavaScript plugins bɛɛ ka data attributes (daɲɛw) bɛ tɔgɔladonni na sisan walasa ka dɛmɛ don ka Bootstrap baarakɛcogo faranfasi ka bɔ mɔgɔ wɛrɛw la ani i yɛrɛ ka kode la. Misali la, an bɛ baara kɛ data-bs-toggleni data-toggle.

  • Sisan, plugins bɛɛ bɛ se ka sɔn CSS sugandili ma i n’a fɔ dalilu fɔlɔ. Aw bɛ se ka DOM yɔrɔ dɔ tɛmɛ walima CSS sugandilikɛlan ɲuman o fɛn bɛ se ka kɛ walasa ka plugin instance kura dɔ da:

    var modal = new bootstrap.Modal('#myModal')
    var dropdown = new bootstrap.Dropdown('[data-bs-toggle="dropdown"]')
    
  • popperConfigbɛ se ka tɛmɛ i n’a fɔ baarakɛcogo min bɛ sɔn Bootstrap ka Popper config default ma i n’a fɔ argument, walasa i ka se ka nin default configuration in fara ɲɔgɔn kan i ka sira kan. A bɛ tali kɛ dropdowns, popovers ani baarakɛminɛnw na.

  • Nafa min bɛ sɔrɔ o la, fallbackPlacementso bɛ Changé ka ['top', 'right', 'bottom', 'left']kɛ walasa ka Popper elements bila ka ɲɛ. A bɛ tali kɛ dropdowns, popovers ani baarakɛminɛnw na.

  • A bɔra forobaciyɛn jɔlenw na i n' a fɔ _getInstance()getInstance().