मुख्य सामग्री पर जाईं डॉक्स नेविगेशन पर जाईं
in English

v5 में माइग्रेट हो रहल बा

बूटस्ट्रैप स्रोत फाइल, दस्तावेज, आ घटक सभ में बदलाव के ट्रैक करीं आ समीक्षा करीं जेह से कि रउआँ के v4 से v5 में माइग्रेट करे में मदद मिल सके।

एह पन्ना पर दिहल गइल बा

निर्भरता के बारे में बतावल गइल बा

  • जेक्वेरी छोड़ दिहल गइल.
  • पॉपर v1.x से पॉपर v2.x में अपग्रेड कइल गइल बा।
  • लिबसास के जगह डार्ट सस के इस्तेमाल कइल गइल काहे कि हमनी के सास कंपाइलर दिहल गइल लिबसास के डिप्रीकेट कइल गइल रहे.
  • हमनी के दस्तावेज बनावे खातिर जेकिल से ह्यूगो में माइग्रेट हो गइल

ब्राउजर के समर्थन बा

  • इंटरनेट एक्सप्लोरर 10 आ 11 के छोड़ दिहल गइल
  • माइक्रोसॉफ्ट एज < 16 (लेगेसी एज) के छोड़ दिहल गइल बा।
  • फायरफॉक्स < 60 छोड़ दिहल गइल
  • सफारी < 12 के छोड़ दिहल गइल
  • आईओएस सफारी < 12 के छोड़ दिहल गइल
  • क्रोम < 60 गिर गईल बा

दस्तावेजीकरण में बदलाव होला

  • होमपेज, डॉक्स लेआउट, आ पाद लेख के नया रूप दिहल गइल बा.
  • नया पार्सल गाइड जोड़ल गइल बा .
  • नया कस्टमाइज सेक्शन जोड़ल गइल , v4 के थीमिंग पन्ना के जगह , Sass, ग्लोबल कॉन्फ़िगरेशन विकल्प, रंग योजना, CSS चर, आ अउरी बहुत कुछ पर नया बिबरन के साथ।
  • सभ फार्म दस्तावेजीकरण के नया फॉर्म खंड में पुनर्गठित कइल गइल , सामग्री के अउरी केंद्रित पन्ना सभ में अलग कइल गइल।
  • एही तरे, लेआउट खंड के अपडेट कइल गइल , ग्रिड सामग्री के अउरी साफ-साफ मांस बनावे खातिर।
  • “Navs” घटक पन्ना के नाम बदल के “Navs & Tabs” रख दिहल गइल बा।
  • “चेक” पन्ना के नाम बदल के “चेक आ रेडियो” कर दिहल गइल.
  • नवबार के नया तरीका से डिजाइन कइल गइल आ एगो नया सबनव जोड़ल गइल जेहसे कि हमनी के साइट आ डॉक्स संस्करणन के घूमे में आसानी हो सके.
  • खोज क्षेत्र खातिर नया कीबोर्ड शॉर्टकट जोड़ल गइल बा: Ctrl + /.

ससस के बा

  • हमनी के डिफ़ॉल्ट Sass मैप मर्ज के खाई में डाल देले बानी जा ताकि फालतू मान के हटावल आसान हो सके। ध्यान रहे कि अब रउआ के सास मैप में सभ मान के परिभाषित करे के होई जईसे $theme-colors. देखल जाव कि सास नक्शा से कइसे निपटल जाला .

  • टूट रहल बाcolor-yiq()फंक्शन आ संबंधित चर सभ के नाँव बदल दिहल गइल काहें से कि color-contrast()ई अब YIQ कलरस्पेस से संबंधित नइखे। देखल जाव #30168।

    • $yiq-contrasted-thresholdके नाम बदल के $min-contrast-ratio.
    • $yiq-text-dark$yiq-text-lightक्रमशः नाम बदल के $color-contrast-dark$color-contrast-light.
  • टूट रहल बामीडिया क्वेरी मिक्सिन पैरामीटर में बदलाव कइल गइल बा आ अधिका तार्किक तरीका से देखल गइल बा.

    • media-breakpoint-down()अगिला ब्रेकपॉइंट के बजाय खुद ब्रेकपॉइंट के इस्तेमाल करे ला (जइसे कि, से छोट लक्ष्य व्यूपोर्ट सभ media-breakpoint-down(lg)के बजाय )।media-breakpoint-down(md)lg
    • एही तरे, दूसरा पैरामीटर में media-breakpoint-between()भी अगिला ब्रेकपॉइंट के बजाय खुद ब्रेकपॉइंट के इस्तेमाल करे ला (उदाहरण खातिर, आ के बीच लक्ष्य व्यूपोर्ट media-between(sm, lg)के बजाय )।media-breakpoint-between(sm, md)smlg
  • टूट रहल बाप्रिंट स्टाइल आ $enable-print-stylesचर के हटा दिहल गइल। प्रिंट डिस्प्ले क्लास अभी भी आसपास बा। देखल जाव #28339 .

  • टूट रहल बाछोड़ color()दिहल गइल , theme-color(), आ gray()चर के पक्ष में फंक्शन। देखल जाव #29083 .

  • टूट रहल बाtheme-color-level()फंक्शन के नाम बदल के color-level()अब खाली रंग के बजाय रउरा जवन रंग चाहीं ओकरा के स्वीकार कर लेला $theme-color. देखल जाव #29083 देखत रहीं: color-level() बाद में छोड़ दिहल गइल रहे v5.0.0-alpha3.

  • टूट रहल बानाम बदल दिहल गइल $enable-prefers-reduced-motion-media-queryआ संक्षेप $enable-pointer-cursor-for-buttonsमें $enable-reduced-motion$enable-button-pointersसंक्षेप में.

  • टूट रहल बाbg-gradient-variant()मिक्सिन के हटा दिहल गइल . .bg-gradientजेनरेट कइल गइल क्लास सभ के बजाय तत्व सभ में ढाल जोड़े खातिर क्लास के इस्तेमाल करीं .bg-gradient-*

  • टूट रहल बा पहिले से पदावनत कइल गइल मिक्सिन सभ के हटा दिहल गइल बा:

    • hover, hover-focus, plain-hover-focus, अउरhover-focus-active
    • float()
    • form-control-mixin()
    • nav-divider()
    • retina-img()
    • text-hide()(संबद्ध उपयोगिता वर्ग के भी छोड़ दिहल गइल, .text-hide)
    • visibility()
    • form-control-focus()
  • टूट रहल बासास के खुद के रंग स्केलिंग फंक्शन से टक्कर से बचे खातिर scale-color()फंक्शन के नाम बदल दिहल गइल।shift-color()

  • box-shadowमिक्सिन अब कई गो आर्गुमेंट से nullमान आ ड्रॉप के अनुमति देला। देखल जाव #30394 .none

  • अब border-radius()मिक्सिन के डिफ़ॉल्ट मान हो गइल बा।

रंग प्रणाली के बा

  • रंग प्रणाली जवन नया रंग प्रणाली के पक्ष में काम करत रहे color-level()आ हटा दिहल गइल रहे। हमनी के कोडबेस में $theme-color-intervalसभ lighten()आ फंक्शन के जगह आ . ई फंक्शन सभ रंग के हल्कापन के एगो निश्चित मात्रा में बदले के बजाय या त सफेद भा करिया रंग से मिला दीहें। कवनो रंग के या त टिंट करी भा शेड करी ई एह बात पर निर्भर करी कि ओकर वजन पैरामीटर सकारात्मक बा कि नकारात्मक . अधिक जानकारी खातिर #30622 देखल जाव ।darken()tint-color()shade-color()shift-color()

  • हर रंग खातिर नया टिंट आ शेड जोड़ल गइल, हर बेस रंग खातिर नौ गो अलग-अलग रंग उपलब्ध करावल गइल, नया सस चर के रूप में।

  • रंग के कंट्रास्ट में सुधार भइल बा. 3:1 से 4.5:1 तक बम्प कलर कंट्रास्ट रेशियो अवुरी WCAG 2.1 एए कंट्रास्ट सुनिश्चित करे खाती नीला, हरे, सियान, अवुरी गुलाबी रंग के अपडेट कईल गईल। साथ ही हमनी के रंग कंट्रास्ट रंग से बदल $gray-900के $black.

  • हमनी के रंग सिस्टम के सपोर्ट करे खातिर हमनी के नया कस्टम tint-color()अवुरी shade-color()फंक्शन जोड़ले बानी जा ताकि हमनी के रंग के उचित तरीका से मिलावल जा सके।

ग्रिड अपडेट हो गइल बा

  • नया ब्रेकपॉइंट बा! खातिर आ ऊपर खातिर नया xxlब्रेकपॉइंट जोड़ल गइल. 1400pxबाकी सभ ब्रेकपॉइंट में कवनो बदलाव ना होई।

  • गटर में सुधार भइल बा. गटर अब rems में सेट हो गइल बा, आ v4 ( 1.5rem, या लगभग 24px, से नीचे 30px) से संकरी बा। एहसे हमनी के ग्रिड सिस्टम के गटर हमनी के स्पेसिंग यूटिलिटीज के संगे संरेखित हो जाला।

    • क्षैतिज/ऊर्ध्वाधर गटर, क्षैतिज गटर, आ ऊर्ध्वाधर गटर के नियंत्रित करे खातिर नया गटर क्लास ( .g-*, .gx-*, आ ) जोड़ल गइल।.gy-*
    • टूट रहल बानया गटर उपयोगिता से मेल खाए खातिर नाम बदल .no-guttersदिहल गइल..g-0
  • अब कॉलम लागू नइखे भइल , एह से ओह व्यवहार के बहाल करे खातिर कुछ तत्वन में position: relativeजोड़े के पड़ सकेला ।.position-relative

  • टूट रहल बाकई गो .order-*क्लास छोड़ दिहलसि जवन अक्सर बेकार हो जात रहे. हमनी के अब खाली आउट ऑफ द बॉक्स के इंतजाम .order-1करेनी जा।.order-5

  • टूट रहल बाघटक के छोड़ दिहल गइल .mediaकाहे कि एकरा के उपयोगिता का साथे आसानी से नकल कइल जा सकेला. उदाहरण खातिर #28265 आ flex utilities पन्ना देखल जाय .

  • टूट रहल बा bootstrap-grid.cssbox-sizing: border-boxअब ग्लोबल बॉक्स-साइजिंग के रीसेट करे के बजाय खाली कॉलम पर लागू होला । एह तरह से हमनी के ग्रिड स्टाइल के बिना कवनो हस्तक्षेप के अधिका जगह इस्तेमाल कइल जा सकेला.

  • $enable-grid-classesअब कंटेनर क्लास के जनरेशन के अक्षम ना करेला। देखल जाव #29146।

  • make-colमिक्सिन के बिना निर्दिष्ट आकार के बराबर कॉलम पर डिफ़ॉल्ट रूप से अपडेट कइल गइल ।

सामग्री, रिबूट आदि के बारे में बतावल गइल बा

  • अब आरएफएस डिफ़ॉल्ट रूप से सक्षम हो गइल बा। मिक्सिन के इस्तेमाल करे वाला हेडिंग सभके व्यूपोर्ट के साथ स्केल करे खातिरfont-size()स्वचालित रूप से समायोजितइ फीचर पहिले v4 के संगे ऑप्ट-इन कईल गईल रहे।font-size

  • टूट रहल बा$display-*हमनी के चर के बदले खातिर आ एगो $display-font-sizesसस मैप से हमनी के डिस्प्ले टाइपोग्राफी के ओवरहाल कइनी जा। $display-*-weightसाथ ही एकल $display-font-weightआ समायोजित font-sizeएस खातिर अलग-अलग चर के हटा दिहल गइल ।

  • .display-*दू गो नया हेडिंग साइज जोड़ल गइल , .display-5.display-6.

  • लिंक सभ के डिफ़ॉल्ट रूप से रेखांकित कइल जाला (केवल होवर पर ना), जबले कि ऊ बिसेस घटक सभ के हिस्सा ना होखे।

  • टेबल सभ के नया तरीका से डिजाइन कइल गइल बा जेह से कि इनहन के स्टाइल के रिफ्रेश कइल जा सके आ स्टाइलिंग पर अउरी नियंत्रण खातिर सीएसएस चर सभ के साथ इनहन के दोबारा बनावल जा सके।

  • टूट रहल बानेस्टेड टेबल अब स्टाइल के विरासत में ना पावेला।

  • टूट रहल बा .thead-lightआ वेरिएंट क्लास .thead-darkसभ के पक्ष में छोड़ दिहल जाला .table-*जेकर इस्तेमाल सभ टेबल तत्व ( thead, tbody, tfoot, tr, thtd) खातिर कइल जा सके ला।

  • टूट रहल बाtable-row-variant()मिक्सिन के नाँव बदल के खाली 2 गो पैरामीटर स्वीकार करे ला table-variant(): $color(रंग के नाँव) आ $value(रंग कोड)। सीमा रंग आ उच्चारण रंग के गणना टेबल फैक्टर चर के आधार पर स्वचालित रूप से कइल जाला।

  • -yटेबल सेल पैडिंग चर के आ में विभाजित करीं -x

  • टूट रहल बा.pre-scrollableक्लास छोड़ दिहल गइल. देखल जाव #29135

  • टूट रहल बा .text-*उपयोगिता अब लिंक में होवर आ फोकस स्टेट ना जोड़त बाड़ी सँ. .link-*एकरा जगह हेल्पर क्लास के इस्तेमाल कइल जा सकेला. देखल जाव #29267

  • टूट रहल बा.text-justifyक्लास छोड़ दिहल गइल. देखल जाव #29793

  • टूट रहल बा <hr>तत्व अब बिसेसता के बेहतर तरीका से सपोर्ट करे खातिर heightके बजाय इस्तेमाल करे लें। एह से पैडिंग यूटिलिटी सभ के इस्तेमाल भी हो सके ला ताकि मोट डिवाइडर (जइसे कि, ) बनावल जा सके।bordersize<hr class="py-1">

  • डिफ़ॉल्ट क्षैतिज padding-leftचालू <ul><ol>तत्वन के ब्राउजर डिफ़ॉल्ट से 40pxरीसेट करीं 2rem.

  • जोड़ा गइल $enable-smooth-scroll, जवन ग्लोबल रूप से लागू होला scroll-behavior: smooth-सिवाय प्रयोगकर्ता लोग के जे prefers-reduced-motionमीडिया क्वेरी के माध्यम से गति कम करे के माँग करे ला। देखल जाव #31877

आरटीएल के बा

  • क्षैतिज दिशा बिसेस चर, उपयोगिता, आ मिक्सिन सभ के नाँव बदल के फ्लेक्सबॉक्स लेआउट सभ नियर तार्किक गुण सभ के इस्तेमाल कइल गइल बा-जइसे कि, startआ आ के endजगह पर ।leftright

फार्म के रूप में बा

  • नया फ्लोटिंग फॉर्म जोड़ल गइल बा! हमनी के फ्लोटिंग लेबल उदाहरण के पूरा तरीका से समर्थित फॉर्म घटक में बढ़ावा देले बानी जा। नया फ्लोटिंग लेबल पन्ना देखल जाय।

  • टूट रहल बा समेकित देशी आ कस्टम रूप तत्व। चेकबॉक्स, रेडियो, सिलेक्ट, आ अउरी इनपुट सभ के एकट्ठा कइल गइल बा जेह में v4 में नेटिव आ कस्टम क्लास रहलें। अब हमनी के लगभग सभ फॉर्म एलिमेंट पूरा तरीका से कस्टम बा, अधिकांश बिना कस्टम एचटीएमएल के जरूरत के।

    • .custom-checkबा अब .form-check.
    • .custom-check.custom-switchबा अब .form-check.form-switch.
    • .custom-selectबा अब .form-select.
    • .custom-file.form-fileऊपर से कस्टम स्टाइल के जगह ले लिहल गइल बा .form-control.
    • .custom-rangeबा अब .form-range.
    • छोड़ दिहल गइल देशी .form-control-file.form-control-range.
  • टूट रहल बागिर .input-group-appendगइल आ .input-group-prepend. अब रउआ बस बटन जोड़ सकेनी आ .input-group-textइनपुट समूहन के डायरेक्ट बच्चा के रूप में।

  • सत्यापन प्रतिक्रिया बग वाला इनपुट समूह पर लंबा समय से चलल आ रहल सीमा त्रिज्या के अंत में सत्यापन के साथ इनपुट समूह सभ में एगो अतिरिक्त .has-validationक्लास जोड़ के ठीक कइल जाला।

  • टूट रहल बा हमनी के ग्रिड सिस्टम खातिर फॉर्म-विशिष्ट लेआउट क्लास छोड़ दिहल गइल. .form-group, .form-row, या के जगह हमनी के ग्रिड आ उपयोगिता के इस्तेमाल करीं .form-inline

  • टूट रहल बाफार्म लेबल के अब जरूरत .form-labelबा .

  • टूट रहल बा .form-textno longer sets display, जवना से रउआँ खाली एचटीएमएल तत्व बदल के इनलाइन या ब्लॉक मदद टेक्स्ट बना सकेनी जइसन रउआँ चाहत बानी।

  • मान्यता आइकन अब <select>s के साथ लागू ना होला multiple

  • के तहत स्रोत Sass फाइल सभ के पुनर्व्यवस्थित कइल गइल scss/forms/, इनपुट समूह शैली सभ सहित।


घटक के बारे में बतावल गइल बा

  • हमनी के चर paddingपर आधारित होखे खातिर अलर्ट, ब्रेडक्रंब, कार्ड, ड्रॉपडाउन, सूची समूह, मोडल, पोपोवर, आ टूलटिप खातिर एकीकृत मान। देखल जाव #30564 .$spacer

अकॉर्डियन के नाम से जानल जाला

अलर्ट कर दिहल गइल बा

  • अब अलर्ट में आइकन वाला उदाहरण बा .

  • हर अलर्ट में s खातिर कस्टम स्टाइल हटा दिहल <hr>गइल काहे कि ऊ लोग पहिले से इस्तेमाल करेला currentColor.

बैज के बा

  • टूट रहल बाबैकग्राउंड यूटिलिटीज खातिर सभ .badge-*रंग क्लास छोड़ दिहल गइल (जइसे कि, के .bg-primaryजगह प��� इस्तेमाल करीं .badge-primary)।

  • टूट रहल बा.badge-pillछोड़ दिहल गइल —एकर जगह .rounded-pillउपयोगिता के इस्तेमाल करीं।

  • टूट रहल बा<a><button>तत्वन खातिर होवर आ फोकस शैली हटा दिहल गइल बा.

  • / से .25em/ तक बैज खातिर डिफ़ॉल्ट पैडिंग बढ़ावल गइल बा ।.5em.35em.65em

  • padding, background-color, आ हटा के ब्रेडक्रंब के डिफ़ॉल्ट रूप के सरल बनावल गइल बा border-radius

  • --bs-breadcrumb-dividerबिना CSS के दोबारा संकलित करे के जरूरत के आसान अनुकूलन खातिर नया CSS कस्टम गुण जोड़ल गइल ।

बटन के बा

  • टूट रहल बा टॉगल बटन , चेकबॉक्स भा रेडियो के साथ, अब जावास्क्रिप्ट के जरूरत नइखे आ नया मार्कअप बा। हमनी के अब कवनो रैपिंग तत्व के जरूरत नइखे, , में जोड़ीं.btn-check,पर कवनो क्लास के<input>साथ जोड़ी बनाईं। देखल जाव #30650 . एकरा खातिर डॉक्स हमनी के बटन पन्ना से नया फॉर्म सेक्शन पर आ गइल बा..btn<label>

  • टूट रहल बा उपयोगिता .btn-blockखातिर छोड़ दिहल गइल. .btn-blockपर इस्तेमाल करे के बजाय .btn, अपना बटन के साथ लपेटीं आ जरूरत के हिसाब से स्पेस करे खातिर .d-gridएगो उपयोगिता। .gap-*ओह पर अउरी अधिका नियंत्रण खातिर रिस्पांसिव क्लास पर स्विच करीं. कुछ उदाहरण खातिर डॉक्स पढ़ीं.

  • अतिरिक्त पैरामीटर के समर्थन करे खातिर हमनी के button-variant()आ मिक्सिन के अपडेट कइल गइल ।button-outline-variant()

  • होवर आ सक्रिय अवस्था पर बढ़ल कंट्रास्ट सुनिश्चित करे खातिर बटन अपडेट कइल गइल।

  • अक्षम बटन पर अब pointer-events: none;.

कार्ड दिहल गइल बा

  • टूट रहल बा.card-deckहमनी के ग्रिड के पक्ष में गिर गईल। अपना कार्ड सभ के कॉलम क्लास में लपेटीं आ .row-cols-*कार्ड डेक सभ के दोबारा बनावे खातिर एगो पैरेंट कंटेनर जोड़ीं (लेकिन रिस्पांसिव संरेखण पर अउरी नियंत्रण के साथ)।

  • टूट रहल बाचिनाई .card-columnsके पक्ष में गिर गईल। देखल जाव #28922 .

  • टूट रहल बा.cardआधारित अकॉर्डियन के बदल के एगो नया अकॉर्डियन घटक दिहल गईल बा .

  • डार्क टेक्स्ट, कंट्रोल, आ इंडिकेटर खातिर नया .carousel-darkवेरिएंट जोड़ल गइल (हल्का बैकग्राउंड खातिर बढ़िया)।

  • हिंडोला नियंत्रण खातिर शेवरॉन आइकन के बूटस्ट्रैप आइकन से नया एसवीजी से बदल दिहल गइल बा .

बटन बंद कर दिहल जाव

  • टूट रहल बाकम जेनेरिक नाँव खातिर नाँव बदल .closeदिहल गइल।.btn-close

  • बंद बटन अब एचटीएमएल में background-imagea के बजाय (एम्बेडेड एसवीजी) के इस्तेमाल करे &times;लें, जेकरा से बिना आपके मार्कअप के छूवे के जरूरत के आसान अनुकूलन हो सके ला।

  • नया .btn-close-whiteवेरिएंट जोड़ल गइल जेकर इस्तेमाल filter: invert(1)गहिरा रंग के बैकग्राउंड के खिलाफ उच्च कंट्रास्ट डिस्मिस आइकन सभ के सक्षम करे खातिर करे ला।

ढहल

  • अकॉर्डियन खातिर स्क्रॉल एंकरिंग हटा दिहल गइल.
  • ऑन-डिमांड डार्क ड्रॉपडाउन खातिर नया .dropdown-menu-darkवेरिएंट आ संबद्ध चर जोड़ल गइल।

  • खातिर नया चर जोड़ल गइल बा $dropdown-padding-x.

  • बेहतर कंट्रास्ट खातिर ड्रॉपडाउन डिवाइडर के गहरा कर दिहल गइल.

  • टूट रहल बाड्रॉपडाउन खातिर सभ इवेंट अब ड्रॉपडाउन टॉगल बटन पर ट्रिगर हो जाला आ फिर मूल तत्व तक ले बबल हो जाला।

  • अब ड्रॉपडाउन मेनू में एगो data-bs-popper="static"एट्रिब्यूट सेट होला जब ड्रॉपडाउन के पोजीशनिंग स्थिर होखे आ data-bs-popper="none"जब ड्रॉपडाउन नवबार में होखे. ई हमनी के जावास्क्रिप्ट द्वारा जोड़ल गइल बा आ पॉपर के पोजीशनिंग में हस्तक्षेप कइले बिना कस्टम पोजीशन स्टाइल के इस्तेमाल करे में मदद करे ला।

  • टूट रहल बादेशी पॉपर flipकॉन्फ़िगरेशन के पक्ष में ड्रॉपडाउन प्लगइन खातिर विकल्प छोड़ दिहल गइल। अब रउआँ फ्लिप संशोधक fallbackPlacementsमें विकल्प खातिर खाली सरणी पास क के फ्लिप व्यवहार के अक्षम क सकत बानी ।

  • ड्रॉपडाउन मेनू अब ऑटो बंद व्यवहारautoClose के संभाले खातिर एगो नया विकल्प के साथ क्लिक करे लायक हो सकेला . रउआँ एह विकल्प के इस्तेमाल ड्रॉपडाउन मेनू के भीतर या बाहर क्लिक के स्वीकार करे खातिर कर सकत बानी ताकि एकरा के इंटरैक्टिव बनावल जा सके।

  • ड्रॉपडाउन अब .dropdown-itemएस में लपेटल एस के समर्थन <li>करेला।

जंबोट्रॉन के बा

समूह के सूची बनाईं

  • , , , आ क्लास में नया nullचर जोड़ल गइल।font-sizefont-weightcolor:hover color.nav-link
  • टूट रहल बानवबार सभ खातिर अब भीतर एगो कंटेनर के जरूरत होला (स्पेसिंग के जरूरत आ सीएसएस के जरूरत के बहुत सरल बनावे खातिर)।

ऑफकैनवास के बा

पृष्ठांकन कइल गइल बा

  • पेजिनेशन लिंक सभ में अब कस्टमाइज करे लायक margin-leftहो जाला जे एक दुसरे से अलग होखे पर सभ कोना पर डायनामिक रूप से गोल हो जालें।

  • transitionपृष्ठांकन लिंक में s जोड़ल गइल बा।

पोपोवर्स के नाम से जानल जाला

  • टूट रहल बाहमनी के डिफ़ॉल्ट पॉपओवर टेम्पलेट में नाम बदल .arrowदिहल गइल बा।.popover-arrow

  • whiteListविकल्प के नाम बदल के allowList.

स्पिनर लोग के बा

  • स्पिनर लोग अब prefers-reduced-motion: reduceएनीमेशन के धीमा क के सम्मान देला। देखल जाव #31882 .

  • स्पिनर के ऊर्ध्वाधर संरेखण में सुधार भइल।

टोस्ट कइल जाला

  • टोस्ट के अब पोजीशनिंग यूटिलिटीज के मदद से एगो में पोजीशन कईल जा सकेला ..toast-container

  • डिफ़ॉल्ट टोस्ट अवधि 5 सेकंड में बदल दिहल गईल।

  • टोस्ट से निकाल के फंक्शन के overflow: hiddenसाथ उचित border-radiusएस से बदल दिहल गइल।calc()

टूलटिप के बारे में बतावल गइल बा

  • टूट रहल बाहमनी के डिफ़ॉल्ट टूलटिप टेम्पलेट में नाम बदल .arrowदिहल गइल बा।.tooltip-arrow

  • टूट रहल बाके खातिर डिफ़ॉल्ट मान के fallbackPlacementsबदल दिहल गइल बा ['top', 'right', 'bottom', 'left']पॉपर तत्व सभ के बेहतर प्लेसमेंट खातिर।

  • टूट रहल बाwhiteListविकल्प के नाम बदल के allowList.

उपयोगिता के बारे में बतावल गइल बा

  • टूट रहल बाRTL समर्थन के जोड़ के दिशात्मक नाँव के बजाय तार्किक गुण नाँव के इस्तेमाल करे खातिर कई गो उपयोगिता सभ के नाँव बदल दिहल गइल:

    • नाम बदल दिहल गइल .left-*.right-*टू .start-*.end-*.
    • नाम बदल दिहल गइल .float-left.float-rightटू .float-start.float-end.
    • नाम बदल दिहल गइल .border-left.border-rightटू .border-start.border-end.
    • नाम बदल दिहल गइल .rounded-left.rounded-rightटू .rounded-start.rounded-end.
    • नाम बदल दिहल गइल .ml-*.mr-*टू .ms-*.me-*.
    • नाम बदल दिहल गइल .pl-*.pr-*टू .ps-*.pe-*.
    • नाम बदल दिहल गइल .text-left.text-rightटू .text-start.text-end.
  • टूट रहल बाडिफ़ॉल्ट रूप से नकारात्मक मार्जिन के अक्षम कइल गइल बा।

  • जल्दी से 's बैकग्राउंड के अतिरिक्त तत्वन पर सेट करे खातिर नया .bg-bodyक्लास जोड़ल गइल।<body>

  • , , , आ खातिर नया स्थिति उपयोगिता जोड़ल गइल बा . मान में हर संपत्ति खातिर , , आ शामिल बा।toprightbottomleft050%100%

  • क्षैतिज रूप से या लंबवत रूप से निरपेक्ष / निश्चित स्थिति तत्वों के केंद्र में नया .translate-middle-x& उपयोगिता जोड़ा गइल।.translate-middle-y

  • नया border-widthउपयोगिता जोड़ल गइल बा .

  • टूट रहल बानाम बदल के रख .text-monospaceदिहल गइल बा .font-monospace.

  • टूट रहल बाहटा दिहल .text-hideगइल काहें से कि ई पाठ के छिपावे के एगो पुरान तरीका हवे जेकर इस्तेमाल अब ना करे के चाहीं।

  • .fs-*उपयोगिता खातिर उपयोगिता जोड़ल गइल font-size(RFS सक्षम के साथ)। ई सभ एचटीएमएल के डिफ़ॉल्ट हेडिंग सभ के समान पैमाना के इस्तेमाल करे लें (1-6, बड़ से छोट), आ इनहन के सैस मैप के माध्यम से संशोधित कइल जा सके ला।

  • टूट रहल बासंक्षिप्तता आ स्थिरता के .font-weight-*रूप में उपयोगिता के नाम बदल दिहल गइल।.fw-*

  • टूट रहल बासंक्षिप्तता आ स्थिरता के .font-style-*रूप में उपयोगिता के नाम बदल दिहल गइल।.fst-*

  • सीएसएस ग्रिड आ फ्लेक्सबॉक्स लेआउट खातिर उपयोगिता आ नया उपयोगिता ( ) .d-gridदेखावे खातिर जोड़ल गइल बा।gap.gap

  • टूट रहल बाहटा दिहल .rounded-smगइल आ rounded-lg, आ कक्षा सभ के एगो नया पैमाना शुरू कइल गइल, .rounded-0के .rounded-3. देखल जाव #31687 .

  • नया line-heightउपयोगिता जोड़ल गइल बा: .lh-1, .lh-sm, .lh-base.lh-lg. इहाँ देखल जाव .

  • हमनी के सीएसएस में .d-noneयूटिलिटी के ले जाइल गइल ताकि एकरा के अउरी डिस्प्ले यूटिलिटी सभ के तुलना में अधिका वजन दिहल जा सके।

  • कंटेनर .visually-hidden-focusableपर भी काम करे खातिर सहायक के विस्तार कइल गइल, :focus-within.

सहायक लोग के बा

  • टूट रहल बा रिस्पांसिव एम्बेड हेल्पर सभ के नाँव बदल के रेशियो हेल्पर सभ में रखल गइल बा जेह में नया क्लास नाँव आ बेहतर व्यवहार बाड़ें आ साथ ही साथ एगो सहायक CSS चर भी बा।

    • कक्षा के नाम बदल के आस्पेक्ट रेशियो में बदल दिहल गइल byबा x. जइसे कि .ratio-16by9अब बा .ratio-16x9.
    • हमनी .embed-responsive-itemके एगो सरल चयनकर्ता के पक्ष में आ तत्व समूह चयनकर्ता के छोड़ देले बानी जा .ratio > *। अउरी क्लास के जरूरत नइखे, आ रेशियो हेल्पर अब कवनो एचटीएमएल तत्व के साथे काम करेला।
    • $embed-responsive-aspect-ratiosसास मैप के नाँव बदल के एकर $aspect-ratiosमान सभ के सरल बनावल गइल बा जेह में क्लास के नाँव आ परसेंट के key: valueजोड़ी के रूप में सामिल कइल गइल बा।
    • अब सीएसएस चर सभ के जनरेट कइल जाला आ सास मैप में हर मान खातिर शामिल कइल जाला। कवनो कस्टम आस्पेक्ट रेशियो बनावे खातिर --bs-aspect-ratioपर चर के संशोधित करीं ..ratio
  • टूट रहल बा “स्क्रीन रीडर” कक्षा अब “दृश्य रूप से छिपल” कक्षा हो गईल बा .

    • सस फाइल के से बदल दिहल गइल scss/helpers/_screenreaders.scssबाscss/helpers/_visually-hidden.scss
    • नाम बदल दिहल गइल .sr-only.sr-only-focusableके .visually-hidden.visually-hidden-focusable
    • नाम बदल दिहल गइल sr-only()sr-only-focusable()मिक्सिन के visually-hidden()visually-hidden-focusable().
  • bootstrap-utilities.cssअब हमनी के सहायक लोग भी शामिल बा। अब कस्टम बिल्ड में हेल्पर के आयात करे के जरूरत नइखे.

जावास्क्रिप्ट के बा

  • jQuery निर्भरता छोड़ दिहल गइल आ प्लगइन सभ के नियमित जावास्क्रिप्ट में होखे खातिर दोबारा लिखल गइल।

  • टूट रहल बासभ जावास्क्रिप्ट प्लगइन सभ खातिर डेटा एट्रिब्यूट सभ के अब नेमस्पेस कइल गइल बा जेह से बूटस्ट्रैप के कामकाज के थर्ड पार्टी आ आपके खुद के कोड से अलग करे में मदद मिल सके। जइसे कि हमनी data-bs-toggleका के जगह पर इस्तेमाल करेनी जा data-toggle.

  • अब सभ प्लगइन पहिला तर्क के रूप में एगो CSS चयनकर्ता के स्वीकार क सके लें। प्लगइन के नया इंस्टेंस बनावे खातिर रउआँ या त कौनों DOM तत्व या कौनों वैध CSS चयनकर्ता के पास क सकत बानी:

    var modal = new bootstrap.Modal('#myModal')
    var dropdown = new bootstrap.Dropdown('[data-bs-toggle="dropdown"]')
    
  • popperConfigएगो फंक्शन के रूप में पास कइल जा सके ला जे बूटस्ट्रैप के डिफ़ॉल्ट पॉपर कॉन्फ़िगरेशन के एगो आर्गुमेंट के रूप में स्वीकार करे ला, ताकि आप एह डिफ़ॉल्ट कॉन्फ़िगरेशन के अपना तरीका से मर्ज क सके लीं। ड्रॉपडाउन, पोपोवर, आ टूलटिप पर लागू होला.

  • के खातिर डिफ़ॉल्ट मान के fallbackPlacementsबदल दिहल गइल बा ['top', 'right', 'bottom', 'left']पॉपर तत्व सभ के बेहतर प्लेसमेंट खातिर। ड्रॉपडाउन, पोपोवर, आ टूलटिप पर लागू होला.

  • _getInstance()→ जइसन सार्वजनिक स्थिर विधि से अंडरस्कोर हटा दिहल गइल बा getInstance()