मुखेल आशयाचेर वचचें डॉक्स नेव्हिगेशनाचेर वचचें
in English

v5 कडेन स्थलांतर करप

तुमकां v4 कडल्यान v5 कडेन स्थलांतरीत करपाक मदत करपाक Bootstrap स्त्रोत फायली, दस्तावेजीकरण, आनी घटकांत बदल ट्रॅक करात आनी पुनरावलोकन करात.

अवलंबून आशिल्लीं

  • jQuery सोडून दिल्लें.
  • Popper v1.x कडल्यान Popper v2.x कडेन अपग्रेड केला.
  • Libsass च्या जाग्यार Dart Sass वापरलो कारण Libsass दिल्लो आमचो Sass संकलक नाका आशिल्लो.
  • आमचें दस्तावेजीकरण तयार करपा खातीर जेकिलांतल्यान ह्यूगोक स्थलांतरीत केलां

ब्राउझर समर्थन

  • इंटरनॅट एक्सप्लोरर 10 आनी 11 सोडले
  • मायक्रोसॉफ्ट एज < 16 (लेगसी एज) सोडला.
  • फायरफॉक्स < 60 सोडला
  • सोडून दिल्लें सफारी < 12
  • सोडले आयओएस सफारी < 12
  • सोडला क्रोम < 60

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

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

सास

  • रिडंडंट मोलां काडप सोंपें करपाक आमी मुलभूत Sass नकाशा विलीनीकरणां खंदक केल्यात. लक्षांत दवरात तुमकां आतां सॅस नकाशांत सगळीं मोलां व्याख्या करचीं पडटलीं जशीं $theme-colors. सास नकाशां कडेन कशें वागचें तें पळयात .

  • तोडणेंcolor-yiq()फंक्शन आनी संबंदीत चड-उणें अशें नांव color-contrast()बदललां कारण तें आतां YIQ colorspace कडेन संबंदीत ना. पळयात # 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
    • तेच प्रमाणें, दुसरो मापदंड in 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()
  • तोडणेंSass च्या स्वताच्या रंग मापन कार्याकडेन टक्कर जावची न्हय म्हूण scale-color()फंक्शनाक नांव बदललां .shift-color()

  • box-shadowmixins आतां nullमोलां परवानगी दितात आनी noneएका परस चड आर्ग्युमेंटांतल्यान सोडटात. पळयात # 30394 .

  • border-radius()मिक्सिनाक आतां मुलभूत मोल आसा .

रंग पद्दत

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

  • दर एका रंगा खातीर नवे टिंट आनी शेड्स जोडले, दरेक बेस रंगा खातीर णव वेगवेगळे रंग पुरवण केले, नवे Sass चड-उणें म्हणून.

  • रंग विपरीतताय सुदारल्या. 3:1 ते 4.5:1 मेरेन रंग विपरीत प्रमाण बम्प केला आनी WCAG 2.1 AA विपरीतताय सुनिश्चीत करपाक निळो, पाचवो, सायन, आनी गुलाबी रंग अद्ययावत केला. तशेंच आमचो रंग कॉन्ट्रास्ट रंग पासून $gray-900ते बदलला $black.

  • आमच्या रंग प्रणालीक आदार दिवपाक, आमी आमच्या रंगांक योग्य रितीन मिक्स करपाक नवी सानुकूल tint-color()आनी shade-color()कार्यां जोडल्यात.

ग्रिड अद्ययावत करता

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

  • सुदारीत गटर. गटर आतां rems मदीं सेट केल्यात, आनी v4 ( 1.5rem, वा सुमार 24px, down from 30px) परस अरुंद आसात. हाका लागून आमच्या ग्रिड प्रणालीचे गटर आमच्या स्पेसिंग उपयुक्तताय कडेन जुळटात.

    • आडवे/उबे गटर, आडवे गटर, आनी उबे गटर नियंत्रीत करपाक नवो गटर वर्ग ( .g-*, .gx-*, आनी ) जोडला..gy-*
    • तोडणेंनव्या गटर उपयुक्ततायांक जुळोवपा .no-guttersखातीर नांव बदललां ..g-0
  • स्तंभ आतां लागू जावंक नात, देखून ती वागणूक परतून मेळोवपाक position: relativeतुमकां कांय घटकांत जोडचें पडूं येता ..position-relative

  • तोडणें.order-*जायते फावट वापरूंक नाशिल्ले कितलेशेच वर्ग सोडले . आमी आतां फकत बॉक्साच्या भायर पुरवण .order-1करतात ..order-5

  • तोडणें.mediaउपयुक्तताय कडेन सहज प्रतिकृती करूं येता म्हणून घटक सोडला . उदाहरणाखातीर #28265 आनी flex उपयुक्तताय पान पळयात .

  • तोडणें bootstrap-grid.cssआतां फकत box-sizing: border-boxजागतीक बॉक्स-आकार रिसेट करचे बदला स्तंभाक लागू जाता. अशे तरेन आमचीं ग्रिड शैलीं चड सुवातेर हस्तक्षेप करिनासतना वापरूं येतात.

  • $enable-grid-classesआतां आतां कंटेनर वर्गांची निर्मिती अक्षम करीना. पळयात # 29146.

  • make-colनिर्दिश्ट आकारा बगर समान स्तंभांक पूर्वनिर्धारीत करपाक mixin अद्ययावत केला .

सामुग्री, रिबूट, आदी

  • RFS आतां पूर्वनिर्धारीतपणान सक्षम केला. मिक्सिन वापरपी शीर्षकांfont-size()आपोआप तांचेंfont-sizeto scale viewport कडेन समायोजीत करतले. हें खाशेलपण आदीं v4 कडेन ऑप्ट-इन आशिल्लें.

  • तोडणें$display-*आमच्या व्हेरिएबल्स बदलपाक आनी $display-font-sizesसॅस नकाशान आमच्या प्रदर्शन टायपोग्राफींत सुदारणा केल्या. $display-*-weightतशेंच एकाच $display-font-weightआनी समायोजीत font-sizes खातीर वैयक्तीक चड-उणें काडून उडयले .

  • दोन नवे .display-*शीर्षक आकार जोडले, .display-5आनी .display-6.

  • दुवे पूर्वनिर्धारीतपणान रेखांकित केल्यात (फकत होवराचेर न्हय), जो मेरेन ते विशिश्ट घटकांचो भाग नात.

  • तांची शैली ताजी करपाक आनी स्टायलिंगाचेर चड नियंत्रणाखातीर CSS चड-उणें कडेन परतून तयार करपाक कोश्टकांची नवी रचना केल्या.

  • तोडणेंनेस्टेड कोश्टक आतां शैली वारसा दिना.

  • तोडणें .thead-lightआनी सगळ्या कोश्टक घटकांखातीर वापरूं येता .thead-darkअशा वेरिएंट वर्गांच्या फाटबळांत सोडून दितात ( , , , , आनी )..table-*theadtbodytfoottrthtd

  • तोडणेंtable-row-variant()मिक्सिनाचें नांव बदललां आनी table-variant()फकत 2 मापदंड स्वीकारता: $color(रंग नांव) आनी $value(रंग कोड). कोश्टक घटक चयापचयाचेर आदारीत शिमेचो रंग आनी उच्चार रंग आपोआप मेजतात.

  • कोश्टक कक्ष पॅडिंग चडांत चड -yआनी हातूंत विभागात -x.

  • तोडणें.pre-scrollableवर्ग सोडलो . पळयात # 29135

  • तोडणें .text-*उपयुक्तताय आतां दुव्यांक होवर आनी फोकस स्थिती जोडनात. .link-*ताचे बदला हेल्पर क्लास वापरूं येतात. पळयात # 29267

  • तोडणें.text-justifyवर्ग सोडलो . पळयात # 29793

  • मुलभूत आडवें padding-leftचालू <ul>आनी <ol>घटक ब्राउझर मुलभूतांतल्यान रीसेट 40pxकरात 2rem.

  • जोडलां $enable-smooth-scroll, जें जागतीक पांवड्यार लागू जाता - माध्यम क्वेरी scroll-behavior: smoothवरवीं उणी गती मागपी वापरप्यांक सोडल्यार . पळयात # 31877prefers-reduced-motion

आर टी एल

  • आडव्या दिका विशिश्ट चड-उणें, उपयुक्तताय, आनी मिक्सिन सगळ्यांक फ्लेक्सबॉक्स मांडावळींनी मेळपी सारके तार्कीक गुणधर्म वापरपाखातीर नांव बदललां-देखीक, startआनी आनी च्या endबदलाक .leftright

रूपां

  • नवे तरंगपी फॉर्म जोडले! आमी फ्लोटिंग लेबल्स उदाहरणाक पुरायपणान समर्थीत फॉर्म घटकांक प्रचार केला. नवे फ्लोटिंग लेबलां पान पळयात.

  • तोडणें एकत्रीत केल्ले मुळ आनी सानुकूल फॉर्म घटक. v4 त मुळ आनी सानुकूल वर्ग आशिल्ले चेकबॉक्स, रेडिओ, निवड, आनी हेर इनपुट एकठांय केल्यात. आतां आमचे लागीं लागीं सगळे फॉर्म एलिमेंट पुरायपणान कस्टम आसात, चडशे कस्टम HTML ची गरज नासतना.

    • .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, तुमकां फकत HTML घटक बदलून तुमकां जाय तसो इनलायन वा ब्लॉक मदत मजकूर तयार करपाक परवानगी दिता.

  • प्रमाणीकरण चिन्नां आतां <select>s कडेन लागू जायनात multiple.

  • scss/forms/, इनपुट गट शैली सयत, खाला स्त्रोत Sass फायलींची पुनर्रचना केल्या .


घटकांचो आस्पाव जाता

  • आमच्या चक्राचेर paddingआदारीत आसपाक सावधानताय, ब्रेडक्रंब, कार्ड, ड्रॉपडावन, यादी गट, मोडल, पोपोव्हर, आनी साधनसूचीं खातीर एकत्रीत मोलां. पळयात # 30564 .$spacer

अकॉर्डियन हें नांव

सावधानताय दिता

बॅज घालतात

  • तोडणेंपार्श्वभूंय उपयुक्तताय खातीर सगळे .badge-*रंग वर्ग सोडले (देखीक, .bg-primaryबदला वापरात .badge-primary).

  • तोडणेंसोडला .badge-pill—ताचे .rounded-pillबदला उपयुक्तताय वापरात.

  • तोडणें<a>आनी <button>घटकांखातीर होवर आनी फोकस शैली काडून उडयल्यात .

  • .25em/ .5emते .35em/ मेरेन बॅजांखातीर मुलभूत पॅडींग वाडयलां .65em.

  • padding, background-color, आनी काडून उडोवन ब्रेडक्रंबांचें मुलभूत रूप सोंपें केलां border-radius.

  • --bs-breadcrumb-dividerCSS परतून संकलित करपाची गरज नासतना सोप्या पसंतीखातीर नवो CSS सानुकूल गुणधर्म जोडला .

बटणां घालतात

  • तोडणें टॉगल बटणां , चेकबॉक्स वा रेडिओ सयत, आतां जावास्क्रिप्टाची गरज ना आनी नवे मार्कअप आसा. आमकां आतां रॅपिंग एलिमेंटाची गरज ना,.btn-check- कडेन<input>, आनी चेर खंयच्याय.btnवर्गां<label>. पळयात # 30650 . हाचे खातीर डॉक्स आमच्या बटणां पानांतल्यान नव्या फॉर्�� विभागांत व्हेल्यात.

  • तोडणें उपयुक्तताय .btn-blockखातीर सोडून दिला. .btn-blockon the वापरचे बदला .btn, तुमचीं बटणां .d-gridआनी गरज पडल्यार तांकां स्पेस दिवपाक एक .gap-*उपयुक्तताय गुठलायात. तांचेर आनीकय चड नियंत्रण मेळोवपा खातीर प्रतिसाद दिवपी वर्गांत वचचें. कांय उदाहरणां खातीर डॉक्स वाचात.

  • अतिरिक्त मापदंडांक आदार दिवपाक आमचे button-variant()आनी मिक्सिन अद्ययावत केल्यात.button-outline-variant()

  • होवर आनी सक्रिय स्थितीचेर वाडिल्लो कॉन्ट्रास्ट सुनिश्चीत करपाक अद्ययावत बटण.

  • अक्षम बटणां आतां pointer-events: none;.

कार्ड

  • तोडणें.card-deckआमच्या ग्रिडाच्या फाटबळांत सोडलो . तुमचीं कार्डां स्तंभ वर्गांत गुठलावचीं आनी .row-cols-*कार्ड डेक परतून तयार करपाक पालक कंटेनर जोडात (पूण प्रतिसाद दिवपी संरेखणाचेर चड नियंत्रण दवरून).

  • तोडणेंमेसनरीच्या .card-columnsफाटबळांत सोडून दिलो. पळयात # 28922 .

  • तोडणें.cardआदारीत अकॉर्डियन बदलून नव्या अकॉर्डियन घटकाचो वापर केला .

  • काळो मजकूर, नियंत्रणां, आनी निर्देशकां खातीर नवो .carousel-darkवेरिएंट जोडला (हलक्या पार्श्वभूंय खातीर बरो).

  • हिंडोला नियंत्रणां खातीर शेवरॉन चिन्नां बदलून बूटस्ट्रॅप चिन्नां कडल्यान नव्या SVG कडेन केल्या .

बंद करचें बटण

  • तोडणेंउण्या सामान्य नांवाखातीर .closeअशें नांव बदललां ..btn-close

  • बंद बटणां आतां HTML त background-imagea बदला एक (एम्बेडेड SVG) वापरतात &times;, तुमच्या मार्कअपाक स्पर्श करपाची गरज नासतना सोंपें पसंतीची परवानगी दिता.

  • गडद पार्श्वभूंयेर चड कॉन्ट्रास्ट डिसमिस चिन्न सक्षम करपाक .btn-close-whiteवापरपी नवो वेरिएंट जोडला .filter: invert(1)

कडसरावचें

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

  • खातीर नवी चड जोडल्या $dropdown-padding-x.

  • सुदारीत कॉन्ट्रास्ट खातीर ड्रॉपडावन डिव्हायडर काळोख केला.

  • तोडणेंड्रॉपडावनाखातीर सगळ्यो घडणुको आतां ड्रॉपडावन टॉगल बटणाचेर ट्रिगर जातात आनी मागीर पालक घटकामेरेन बुडबुडें मारतात.

  • ड्रॉपडावन मेनूंत आतां data-bs-popper="static"ड्रॉपडावनाची सुवात स्थिर आसता आनी data-bs-popper="none"ड्रॉपडावन नॅव्हबारांत आसतना एक गुणधर्म सेट केल्ली आसता. हें आमच्या जावास्क्रिप्टान जोडलां आनी Popper च्या पोझिशनिंगांत हस्तक्षेप करिनासतना सानुकूल स्थिती शैली वापरपाक आमकां मदत करता.

  • तोडणेंflipमुळ Popper संरचनेच्या फायद्या खातीर ड्रॉपडावन प्लगइन खातीर पर्याय सोडला . तुमी आतां फ्लिप संशोधकांत fallbackPlacementsपर्यायाखातीर रिकामी ऍरे पास करून फ्लिपिंग वर्तन अक्षम करूंक शकतात .

  • ड्रॉपडावन मेनू आतां ऑटो बंद वर्तनautoClose हाताळपाक नव्या पर्याया सयत क्लिक करपाक मेळटात . तुमी हो पर्याय वापरून ड्रॉपडावन मेनू भितर वा भायर क्लिक स्विकारूंक शकतात ताका परस्पर संवादात्मक करपाक.

  • ड्रॉपडावन आतां .dropdown-items मदीं गुठलायल्ले <li>s समर्थन करतात.

जंबोट्रॉन हें नांव

यादी गट

  • , , , आनी वर्गांत नवे nullचडांत चड जोडल्यात .font-sizefont-weightcolor:hover color.nav-link
  • तोडणेंNavbars आतां भितर एक कंटेनर जाय (अंतराची गरज खरपणान सोंपे करपाक आनी CSS गरज आसा).

ऑफकॅनव्हास

पृष्ठांकन करप

  • पृष्ठांकन दुव्यांक आतां सानुकूल करपाक 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

  • तोडणेंपॉपर घटकांची चड बरी प्लेसमेंट करपाखातीर the खातीर मुलभूत मोल 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 सक्षम करून). हे HTML च्या मुलभूत शीर्षकां प्रमाणें प्रमाण वापरतात (1-6, व्हड ते ल्हान), आनी Sass नकाशा वरवीं बदलूं येता.

  • तोडणेंसंक्षिप्तताय आनी सुसंगती खातीर .font-weight-*उपयुक्ततायांचें नांव बदललें ..fw-*

  • तोडणेंसंक्षिप्तताय आनी सुसंगती खातीर .font-style-*उपयुक्ततायांचें नांव बदललें ..fst-*

  • CSS ग्रिड आनी flexbox मांडावळी खातीर उपयुक्तताय आनी नवी उपयुक्तताय ( ) .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हेर प्रदर्शन उपयुक्ततायांचेर चड वजन दिवपाक आमच्या CSS त उपयुक्तताय हालयल्या .

  • कंटेनरांचेरूय काम करपाक .visually-hidden-focusableमदतगार विस्तार केला, वापरून :focus-within.

मदत करपी

  • तोडणें प्रतिसाद दिवपी एम्बेड मदतगारांक नव्या वर्ग नांवां आनी सुदारीत वागणूक, तशेंच उपकारक CSS चड-उणें आशिल्ल्या प्रमाण मदतगारांक नांव बदललां.

    • वर्गांचें नांव बदलून आस्पॅक्ट रेशियोंत बदल byकेलां . xदेखीक, .ratio-16by9आतां आसा .ratio-16x9.
    • आमी .embed-responsive-itemआनी घटक गट निवडक सोडला आनी साद्या निवडकाच्या फाटबळाचेर .ratio > *. आनीक वर्गाची गरज ना, आनी रेशियो हेल्पर आतां खंयच्याय HTML घटका वांगडा काम करता.
    • $embed-responsive-aspect-ratiosSass नकाशाचें नांव बदललां आनी $aspect-ratiosताचीं मोलां सोंपी केल्यांत जाका लागून वर्ग नांव आनी टक्केवारी key: valueजोडी म्हणून आसपावीत केल्या.
    • आतां CSS चड-उणें तयार केल्यात आनी Sass नकाशांत दरेक मोला खातीर समाविष्ट केल्यात. खंयचेंय सानुकूल आस्पॅक्ट रेशियो--bs-aspect-ratio तयार करपाक चेर व्हेरिएबल बदलचें ..ratio
  • तोडणें “स्क्रीन रीडर” वर्ग आतां “दृश्य लिपल्ले” वर्ग जाल्यात .

    • Sass फायल पासून scss/helpers/_screenreaders.scssto बदलल्या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 अवलंबन सोडून दिल्या आनी प्लगइन नियमित जावास्क्रिप्टांत आसपाक परतून बरयल्यात.

  • तोडणेंसगळ्या JavaScript प्लगइनांखातीर डेटा गुणधर्म आतां नांवस्पेस केल्यात, जाका लागून Bootstrap कार्यक्षमताय तिसऱ्या पक्षां कडल्यान आनी तुमच्या स्वताच्या कोडांतल्यान वेगळी करपाक मदत जातली. देखीक, आमी data-bs-toggleबदला वापरतात data-toggle.

  • सगळे प्लगइन आतां पयलो आर्ग्युमेंट म्हणून CSS निवडपी स्वीकारूंक शकतात. प्लगइनाची नवी दृष्टांत तयार करपाक तुमी एक तर DOM घटक वा खंयचोय वैध CSS निवडपी पास करूंक शकतात:

    var modal = new bootstrap.Modal('#myModal')
    var dropdown = new bootstrap.Dropdown('[data-bs-toggle="dropdown"]')
    
  • popperConfigबूटस्ट्रॅपाची मुलभूत Popper संरचना आर्ग्युमेंट म्हणून स्वीकारपी फंक्शन म्हणून पास करूंक शकता, जेणे करून तुमी ही मुलभूत संरचना तुमच्या मार्गान विलीन करूंक शकतात. ड्रॉपडावन, पॉपओव्हर, आनी टूलटिप्साक लागू जाता.

  • Popper घटकांची चड बरी प्लेसमेंट करपाखातीर the खातीर मुलभूत मोल fallbackPlacementsबदललां . ड्रॉपडावन, पॉपओव्हर, आनी टूलटिप्साक लागू जाता.['top', 'right', 'bottom', 'left']

  • _getInstance()→ सारकिल्या भौशीक स्थिर पद्दतींतल्यान अंडरस्कोर काडून उडयला getInstance().