Негізгі мазмұнға өту Құжаттар шарлауына өту
in English

v5 нұсқасына көшу

v4 нұсқасынан v5 нұсқасына көшуге көмектесу үшін Bootstrap бастапқы файлдарына, құжаттамасына және құрамдастарына жасалған өзгерістерді қадағалаңыз және қарап шығыңыз.

Тәуелділіктер

  • jQuery жойылды.
  • Popper v1.x нұсқасынан Popper v2.x нұсқасына дейін жаңартылды.
  • Libsass-ты Dart Sass-пен ауыстырды, өйткені Libsass ескірген Sass компиляторы.
  • Құжаттамамызды жасау үшін Джекиллден Гюгоға көшті

Браузерді қолдау

  • Internet Explorer 10 және 11 жойылды
  • Microsoft Edge түсірілді < 16 (Бұрынғы Edge)
  • Firefox < 60 жойылды
  • Safari < 12 жойылды
  • iOS Safari < 12 жойылды
  • Chrome < 60 жойылды

Құжаттамадағы өзгерістер

  • Негізгі бет, құжаттар орналасуы және төменгі деректеме қайта жасалды.
  • Жаңа сәлемдеме нұсқаулығы қосылды .
  • Sass туралы жаңа мәліметтермен, жаһандық конфигурация опцияларымен, түс схемаларымен, CSS айнымалыларымен және т.б. бар v4 нұсқасының Тақырыптық бетін ауыстыратын жаңа теңшеу бөлімі қосылды .
  • Барлық пішін құжаттамасын жаңа пішіндер бөліміне қайта ұйымдастырып , мазмұнды көбірек бағытталған беттерге бөлді.
  • Сол сияқты, тор мазмұнын нақтырақ көрсету үшін Орналасу бөлімі жаңартылды .
  • «Navs» құрамдас беті «Navs & Tabs» деп өзгертілді.
  • «Тексерулер» беті «Чектер және радиолар» деп өзгертілді.
  • Тораптарымыз бен құжаттар нұсқаларын аралауды жеңілдету үшін шарлау тақтасын қайта жасақтап, жаңа қосымша қосылды.
  • Іздеу өрісі үшін жаңа пернелер тіркесімі қосылды: Ctrl + /.

Сасс

  • Біз артық мәндерді жоюды жеңілдету үшін әдепкі Sass картасы біріктірулерін алып тастадық. Енді Sass карталарындағы барлық мәндерді анықтау керек екенін есте сақтаңыз $theme-colors. Sass карталарымен қалай күресуге болатынын тексеріңіз .

  • Бұзылуcolor-yiq()Функция және қатысты айнымалылар атауы YIQ color-contrast()түс кеңістігіне қатысты емес болғандықтан өзгертілді. №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(), және функциялары түсірілді. №29083 қараңыз .gray()

  • БұзылуАтауы өзгертілген 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-shadowмиксиндер енді nullмәндерге рұқсат береді және noneбірнеше аргументтерден бас тартады. №30394 қараңыз .

  • border-radius()Микстің енді әдепкі мәні бар .

Түс жүйесі

  • Жаңа түс жүйесінің пайдасына жұмыс істеген color-level()және $theme-color-intervalжойылған түс жүйесі. Біздің кодтық базадағы барлық lighten()және darken()функциялар және арқылы tint-color()ауыстырылады shade-color(). Бұл функциялар түстің ашықтығын белгіленген мөлшерге өзгертудің орнына ақ немесе қара түспен араластырады. shift-color()Салмақ параметрінің оң немесе теріс болуына байланысты түсті реңктендіреді немесе көлеңкелейді . Қосымша мәліметтер алу үшін №30622 қараңыз .

  • Әрбір түс үшін жаңа реңктер мен реңктер қосылды, әр негізгі түс үшін жаңа Sass айнымалылары ретінде тоғыз бөлек түсті қамтамасыз етеді.

  • Жақсартылған түс контрасты. WCAG 2.1 AA контрастын қамтамасыз ету үшін 3:1-ден 4,5:1-ге дейін жеңілдетілген түс контрастының қатынасы және көк, жасыл, көгілдір және қызғылт түстер жаңартылды. $gray-900Сондай-ақ , біздің түс контрастын түсін өзгертті $black.

  • Түстер жүйесін қолдау үшін біз түстерді сәйкес араластыру үшін жаңа теңшеу tint-color()мен функцияларды қостық.shade-color()

Тор жаңартулары

  • Жаңа тоқтау нүктесі! және одан жоғары үшін жаңа xxlтоқтау нүктесі қосылды 1400px. Барлық басқа тоқтау нүктелеріне өзгерістер жоқ.

  • Жақсартылған шұңқырлар. Арықтар енді рем түрінде орнатылған және олар v4-тен тар ( 1.5rem, немесе шамамен 24px-дан төмен 30px). Бұл біздің желілік жүйенің саңылауларын аралық утилиталарымызбен туралайды.

    • Көлденең/тік арықтарды, көлденең суағарларды және тік ағындарды басқару үшін жаңа арық класы ( .g-*, .gx-*, және ) қосылды..gy-*
    • БұзылуЖаңа арық утилиталарына сәйкес .no-guttersболу үшін атауы өзгертілді ..g-0
  • Бағандар енді қолданылмайды, сондықтан сол әрекетті қалпына келтіру үшін кейбір элементтерге position: relativeқосу қажет болуы мүмкін ..position-relative

  • Бұзылу.order-*Жиі пайдаланылмайтын бірнеше сабақты тастады. Біз енді тек қораптан тыс қамтамасыз .order-1етеміз ..order-5

  • БұзылуКомпонент тасталды, .mediaсебебі оны утилиталармен оңай көшіруге болады. Мысал үшін №28265 және икемді утилиталар бетін қараңыз .

  • Бұзылу bootstrap-grid.cssенді box-sizing: border-boxжаһандық қорап өлшемін қалпына келтірудің орнына тек бағанға қолданылады. Осылайша, тор мәнерлерімізді кедергісіз көбірек жерлерде пайдалануға болады.

  • $enable-grid-classesенді контейнер сыныптарын құруды өшірмейді. №29146 қараңыз.

  • make-colБелгіленген өлшемі жоқ тең бағандарға арналған араластырғыш әдепкіге жаңартылды .

Мазмұн, қайта жүктеу және т.б

  • RFS енді әдепкі бойынша қосылған. Араластырғышты пайдаланатын тақырыптарfont-size()автоматты түрдеfont-sizeқарау терезесімен масштабтауға реттеледі. Бұл мүмкіндік бұрын v4 нұсқасына қосылған.

  • Бұзылу$display-*Айнымалы мәндерді және $display-font-sizesSass картасымен ауыстыру үшін дисплей типографиясын күрделі жөндеуден өткіздік. Сондай-ақ жалғыз және түзетілген s $display-*-weightүшін жеке айнымалылар жойылды .$display-font-weightfont-size

  • Екі жаңа .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арқылы қозғалысты азайтуды сұрайтын пайдаланушыларды қоспағанда . №31877 қараңызprefers-reduced-motion

RTL

  • Көлденең бағыттағы арнайы айнымалы мәндердің, утилиталардың және миксиндердің барлығы flexbox орналасуларында табылған логикалық сипаттарды пайдалану үшін өзгертілді, мысалы, startжәне endорнына leftжәне орнына right.

Пішіндер

  • Жаңа қалқымалы пішіндер қосылды! Біз қалқымалы белгілер мысалын толық қолдау көрсетілетін пішін құрамдастарына көтердік. Жаңа қалқымалы белгілер бетін қараңыз.

  • Бұзылу Біріктірілген бастапқы және теңшелетін пішін элементтері. 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-textенді орнатылмайды display, бұл сізге HTML элементін өзгерту арқылы кірістірілген немесе анықтама мәтінін қалауыңыз бойынша блоктауға мүмкіндік береді.

  • Тексеру белгішелері енді <select>s үшін қолданылмайды multiple.

  • scss/forms/Кіріс тобының мәнерлерін қоса, астындағы бастапқы Sass файлдары қайта реттелді .


Құрамдас бөліктер

  • paddingЕскертулер, нан үгінділері, карталар, ашылмалы тізімдер, тізім топтары, модальдар, қалқымалы мәндер және $spacerайнымалы мәнге негізделетін құралдар кеңестері үшін бірыңғай мәндер. №30564 қараңыз .

Аккордеон

Ескертулер

  • Енді ескертулерде белгішелер бар мысалдар бар .

  • Әрбір ескертудегі 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-dividerCSS қайта құрастыруды қажет етпестен оңай теңшеу үшін жаңа CSS теңшелетін сипаты қосылды .

Түймелер

  • Бұзылу Құсбелгілері немесе радиосы бар ауыстырып- қосқыш түймелері енді JavaScript-ті қажет етпейді және жаңа белгілеулері бар. Біз енді орау элементін қажет етпейміз, оған қосыңыз.btn-checkжәне<input>оны кез келген.btnсыныптармен<label>. №30650 қараңыз . Бұл үшін құжаттар түймелер бетінен жаңа пішіндер бөліміне көшті.

  • Бұзылу Коммуналдық қызметтерге жіберілді .btn-block. түймелерін пайдаланудың орнына қажетінше бос орын қалдыру үшін түймелерді және қызметтік .btn-blockбағдарламамен ораңыз. Оларды көбірек бақылау үшін жауап беретін сыныптарға ауысыңыз. Кейбір мысалдар үшін құжаттарды оқыңыз..btn.d-grid.gap-*

  • Қосымша параметрлерді қолдау үшін біздің button-variant()және миксиндер жаңартылды.button-outline-variant()

  • Меңзерді жылжытқанда және белсенді күйде жоғары контрастты қамтамасыз ету үшін жаңартылған түймелер.

  • Өшірілген түймелер енді бар pointer-events: none;.

Карта

  • Бұзылу.card-deckБіздің тордың пайдасына төмендеді . Карточкаларды баған сыныптарына орап, .row-cols-*карта палубаларын қайта жасау үшін ата-аналық контейнерді қосыңыз (бірақ жауап беретін туралауды көбірек бақылаумен).

  • БұзылуМасондық .card-columnsпайдасына төмендеді. №28922 қараңыз .

  • Бұзылу.cardНегізгі аккордеон жаңа Аккордеон компонентімен ауыстырылды .

Жабу түймесі

  • БұзылуАты азырақ жалпы атау үшін .closeөзгертілді ..btn-close

  • Жабу түймелері енді HTML background-imageтіліндегі a орнына (ендірілген SVG) пайдаланады &times;, бұл түзетуді түртудің қажетінсіз оңай теңшеуге мүмкіндік береді.

  • Қараңғы фонға қарсы белгішелердің жоғары контрастты өшіруін қосу үшін .btn-close-whiteпайдаланылатын жаңа нұсқа қосылды .filter: invert(1)

Жыйрату

  • Аккордеондарға арналған айналдыру анкері жойылды.
  • .dropdown-menu-darkСұраныс бойынша қараңғы ашылмалы тізімдер үшін жаңа нұсқа және байланысты айнымалылар қосылды .

  • үшін жаңа айнымалы қосылды $dropdown-padding-x.

  • Контрастты жақсарту үшін ашылмалы бөлгіш қараңғыланды.

  • БұзылуАшылмалы тізімге арналған барлық оқиғалар енді ашылмалы тізімнің ауыстырып-қосқыш түймешігінде іске қосылады, содан кейін негізгі элементке дейін көпіршіктеледі.

  • Ашылмалы мәзірлер енді data-bs-popper="static"ашылмалы тізімнің орналасуы статикалық болғанда және ашылмалы тізім шарлау тақтасында болғанда орнатылған төлсипатқа ие data-bs-popper="none". Бұл біздің JavaScript арқылы қосылған және Поппердің орналасуына кедергі келтірместен реттелетін орын мәнерлерін пайдалануға көмектеседі.

  • БұзылуflipТүпнұсқа Popper конфигурациясының пайдасына ашылмалы плагинге арналған опция жойылды . Енді айналдыру әрекетін флип модификаторындағы fallbackPlacementsопция үшін бос массив өткізу арқылы өшіруге болады.

  • Ашылмалы мәзірлерді енді автоматты жабу әрекетінautoClose өңдеуге арналған жаңа опциямен басуға болады . Бұл опцияны интерактивті ету үшін ашылмалы мәзірдің ішінде немесе сыртында шертуді қабылдау үшін пайдалануға болады.

  • Ашылмалы тізімдер енді .dropdown-items ішіне оралған <li>.

Джумботрон

Тізім тобы

  • , , , және сыныпқа жаңа nullайнымалылар қосылды .font-sizefont-weightcolor:hover color.nav-link
  • БұзылуШарлау жолақтары енді контейнерді қажет етеді (аралық талаптарды және қажет CSS-ті айтарлықтай жеңілдету үшін).

Offcanvas

Беттеу

  • Беттеу сілтемелері енді margin-leftбір-бірінен бөлінген кезде барлық бұрыштарда динамикалық түрде дөңгелектенетін теңшелетін болады.

  • transitionБеттеу сілтемелеріне s қосылды .

Поповерлер

  • БұзылуӘдепкі қалқымалы үлгіде атауы өзгертілді .arrow..popover-arrow

  • whiteListОпция деп аталды allowList.

Спиннерлер

  • Спиннерлер енді prefers-reduced-motion: reduceанимацияларды баяулату арқылы құрметтейді. №31882 қараңыз .

  • Жақсартылған спиннерді тік туралау.

Тосттар

  • Тосттарды енді позициялау утилиталарының.toast-container көмегімен орналастыруға болады .

  • Әдепкі тост ұзақтығы 5 секундқа өзгертілді.

  • Тосттардан алынып , функциялары overflow: hiddenбар тиісті border-radiuss- мен ауыстырылды.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
  • БұзылуӘдепкі бойынша теріс шеттер өшірілген.

  • Қосымша элементтерге фонын .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 Grid және 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 элементімен жұмыс істейді.
    • Sass картасының атауы $embed-responsive-aspect-ratiosөзгертілді $aspect-ratiosжәне оның мәндері сынып атауы мен пайызды key: valueжұп ретінде қосу үшін жеңілдетілді.
    • CSS айнымалылары енді жасалады және Sass картасындағы әрбір мән үшін қосылады. Кез келген теңшелетін арақатынасты жасау үшін --bs-aspect-ratioайнымалы мәнді өзгертіңіз ..ratio
  • Бұзылу «Экраннан оқу» сыныптары енді «көзбен жасырын» сыныптар болып табылады .

    • scss/helpers/_screenreaders.scssSass файлын келесіден өзгертті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енді біздің көмекшілеріміз де бар. Көмекшілерді енді теңшелетін құрылымдарда импорттау қажет емес.

JavaScript

  • JQuery тәуелділігі жойылды және әдеттегі JavaScript-те болу үшін плагиндер қайта жазылды.

  • БұзылуБарлық 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Бұл әдепкі конфигурацияны өз жолыңызда біріктіру үшін Bootstrap әдепкі Popper конфигурациясын аргумент ретінде қабылдайтын функция ретінде беруге болады. Ашылмалы тізімдерге, қалқымалы терезелерге және құралдар кеңестеріне қолданылады.

  • Поппер элементтерін жақсырақ орналастыру үшін әдепкі мәні fallbackPlacementsболып өзгереді . Ашылмалы тізімдерге, қалқымалы терезелерге және құралдар кеңестеріне қолданылады.['top', 'right', 'bottom', 'left']

  • _getInstance()→ сияқты жалпыға ортақ статикалық әдістерден астын сызу жойылды getInstance().