Holo i ka ʻike nui Holo i ka hoʻokele docs
in English

Ke neʻe nei i v5

E hahai a nānā i nā loli i nā waihona kumu Bootstrap, nā palapala, a me nā ʻāpana e kōkua iā ʻoe e neʻe mai v4 a i v5.

Ma kēia ʻaoʻao

Nā hilinaʻi

  • Hāʻule ka jQuery.
  • Hoʻonui ʻia mai Popper v1.x a i Popper v2.x.
  • Ua hoʻololi ʻo Libsass me Dart Sass e like me kā mākou Sass compiler i hāʻawi ʻia iā Libsass i hoʻopau ʻia.
  • Ua neʻe mai Jekyll a Hugo no ke kūkulu ʻana i kā mākou palapala

Kākoʻo polokalamu kele pūnaewele

  • Ua haʻalele ʻo Internet Explorer 10 a me 11
  • Hāʻule ʻo Microsoft Edge <16 (Legacy Edge)
  • Haʻalele ʻo Firefox <60
  • Hāʻule ʻo Safari <12
  • Haʻalele ʻo iOS Safari <12
  • Hāʻule ka Chrome <60

Hoʻololi palapala

  • ʻO ka ʻaoʻao home i hoʻolālā hou ʻia, ka hoʻolālā docs, a me ka wāwae.
  • Hoʻohui hou ʻia ke alakaʻi Parcel .
  • Hoʻohui hou i ka ʻāpana Hoʻopilikino hou , hoʻololi i ka ʻaoʻao Theming o v4 , me nā kikoʻī hou no Sass, nā koho hoʻonohonoho honua, nā ʻāpana kala, nā ʻano CSS, a me nā mea hou aku.
  • Hoʻonohonoho hou i nā palapala palapala a pau i loko o ka ʻāpana Forms hou , e hoʻokaʻawale i ka ʻike i nā ʻaoʻao kikoʻī.
  • Pēlā nō, hōʻano hou i ka ʻāpana Layout , e hoʻomaʻemaʻe i ka ʻike kikoʻī.
  • Kapa hou ʻia ka ʻaoʻao ʻāpana "Navs" i "Navs & Tabs".
  • Ua kapa hou ʻia ka ʻaoʻao "Checks" i "Checks & radios".
  • Hoʻolālā hou i ka navbar a hoʻohui i kahi subnav hou i mea e maʻalahi ai ka hele ʻana a puni kā mākou pūnaewele a me nā mana docs.
  • Hoʻohui ʻia ka pōkole kīpē hou no ke kahua huli: Ctrl + /.

Sass

  • Ua haʻalele mākou i ka hui ʻana o ka palapala ʻāina Sass paʻamau i mea e maʻalahi ai ka wehe ʻana i nā waiwai nui. E hoʻomanaʻo i kēia manawa pono ʻoe e wehewehe i nā waiwai āpau ma nā palapala Sass e like me $theme-colors. E nānā pehea e hana ai me nā palapala ʻāina Sass .

  • HaʻihaʻiHoʻololi ʻia color-yiq()ka hana a me nā mea hoʻololi pili i color-contrast()ka mea ʻaʻole pili hou i ka YIQ colorspace. Nānā #30168.

    • $yiq-contrasted-thresholdua kapa hou ia i $min-contrast-ratio.
    • $yiq-text-darka $yiq-text-lightua kapa hou ia i $color-contrast-darkka $color-contrast-light.

  • HaʻihaʻiUa hoʻololi ʻia nā ʻokoʻa hoʻohui ʻia no ka hoʻololi ʻana i ke ʻano loiloi.

    • media-breakpoint-down()hoʻohana i ka breakpoint pono'ī ma kahi o ka breakpoint e hiki mai ana (e laʻa, media-breakpoint-down(lg)ma kahi o media-breakpoint-down(md)nā pahu nānā i ʻoi aku ka liʻiliʻi ma mua o lg).
    • Pēlā nō, hoʻohana ka ʻāpana ʻelua media-breakpoint-between()i ka breakpoint ponoʻī ma mua o ka breakpoint e hiki mai ana (e laʻa, media-between(sm, lg)ma kahi o media-breakpoint-between(sm, md)nā pahu nānā i waena sma me lg).

  • HaʻihaʻiWehe ʻia nā ʻano paʻi a me $enable-print-stylesnā loli. Aia mau nā papa hōʻike paʻi. E nana #28339 .

  • HaʻihaʻiHoʻokuʻu ʻia color(), theme-color(), a me gray()nā hana i makemake i nā mea hoʻololi. E nana #29083 .

  • HaʻihaʻiHana ʻia i ka inoa theme-color-level()hou color-level()a ʻae i kēia manawa i nā kala āu e makemake ai ma mua o nā $theme-colorkala wale nō. E nānā i ka #29083 E makaʻala: color-level() ua hoʻokuʻu ʻia ma hope v5.0.0-alpha3.

  • HaʻihaʻiHoʻololi i ka inoa $enable-prefers-reduced-motion-media-querya no ka pōkole.$enable-pointer-cursor-for-buttons$enable-reduced-motion$enable-button-pointers

  • HaʻihaʻiWehe ʻia ka bg-gradient-variant()mixin. E hoʻohana i ka .bg-gradientpapa e hoʻohui i nā gradients i nā mea ʻeleʻele ma mua o nā .bg-gradient-*papa i hana ʻia.

  • Haʻihaʻi Wehe ʻia nā huila i hoʻopau mua ʻia:

    • hover, hover-focus, plain-hover-focus, ahover-focus-active
    • float()
    • form-control-mixin()
    • nav-divider()
    • retina-img()
    • text-hide()(ua hoʻokuʻu pū i ka papa hana pili, .text-hide)
    • visibility()
    • form-control-focus()

  • HaʻihaʻiHoʻololi scale-color()i ka hana i mea shift-color()e pale aku ai i ka hui ʻana me kā Sass ponoʻī hana hoʻonui kala.

  • box-shadowʻAe nā mixins i nā nullwaiwai a hāʻule nonemai nā manaʻo he nui. E nana #30394 .

  • He border-radius()waiwai paʻamau ka mixin i kēia manawa.

Pūnaehana kala

  • ʻO ka ʻōnaehana waihoʻoluʻu i hana pū color-level()a $theme-color-intervalwehe ʻia no kahi ʻōnaehana kala hou. Hoʻololi ʻia nā hana āpau lighten()a me darken()nā hana ma kā mākou codebase e tint-color()a me shade-color(). E hoʻohui kēia mau hana i ke kala me ke keʻokeʻo a ʻeleʻele paha ma mua o ka hoʻololi ʻana i kona māmā me ka nui paʻa. ʻO shift-color()ke kala a i ʻole ka waihoʻoluʻu e pili ana i ka maikaʻi a i ʻole ka maikaʻi ʻole o kona ʻāpana kaumaha. E ʻike i ka #30622 no nā kikoʻī hou aku.

  • Hoʻohui ʻia nā kala hou a me nā aka no kēlā me kēia kala, e hāʻawi ana i ʻeiwa kala ʻokoʻa no kēlā me kēia waihoʻoluʻu kumu, e like me nā hoʻololi Sass hou.

  • Ua hoʻomaikaʻi ʻia ka ʻokoʻa kala. Hoʻokaʻawale ʻia nā kala ʻokoʻa mai ka 3:1 a i ka 4.5:1 a hōʻano hou ʻia nā kala uliuli, ʻōmaʻomaʻo, cyan, a me ka ʻulaʻula e hōʻoia i ka ʻokoʻa WCAG 2.1 AA. Ua hoʻololi hoʻi i kā mākou kala ʻokoʻa mai $gray-900ka $black.

  • No ke kākoʻo ʻana i kā mākou ʻōnaehana kala, ua hoʻohui mākou i nā hana maʻamau tint-color()a me shade-color()nā hana hou e hoʻohui pono i kā mākou kala.

Nā hōʻano hou grid

  • ʻO ka wahi haʻihaʻi hou! Hoʻohui ʻia i kahi xxlhoʻomaha hou no 1400pxa i luna. ʻAʻohe hoʻololi i nā wahi hoʻomaha ʻē aʻe.

  • Hoʻomaikaʻi ʻia nā ʻauwai. Hoʻonohonoho ʻia nā ʻauwai i nā rem, a ua ʻoi aku ka liiki ma mua o v4 ( 1.5rem, a i ʻole ma kahi o 24px, iho mai 30px). Hoʻolikelike kēia i nā ʻauwai o kā mākou pūnaewele puni honua me kā mākou mau pono hoʻokaʻawale.

    • Hoʻohui ʻia ka papa ʻauwai hou ( .g-*, .gx-*, a .gy-*) no ka hoʻomalu ʻana i nā ʻauwai ākea/kūpono, nā ʻauwai ākea, a me nā ʻauwai kūpaʻa.
    • HaʻihaʻiHoʻololi hou .no-guttersʻia i .g-0ka hoʻohālikelike ʻana i nā pono hana auwai hou.

  • ʻAʻole i position: relativehoʻohana hou ʻia nā kolamu, no laila pono ʻoe e hoʻohui .position-relativei kekahi mau mea e hoʻihoʻi i kēlā ʻano.

  • HaʻihaʻiHoʻokuʻu i kekahi mau .order-*papa i hoʻohana pinepine ʻole ʻia. Hāʻawi wale mākou .order-1i .order-5waho o ka pahu.

  • HaʻihaʻiHoʻokuʻu i ka ʻāpana no ka .mediamea hiki ke maʻalahi me nā pono hana. E ʻike i ka #28265 a me ka ʻaoʻao ʻoihana hoʻololi no kahi laʻana .

  • Haʻihaʻi bootstrap-grid.cssi kēia manawa pili wale box-sizing: border-boxi ke kolamu ma mua o ka hoʻonohonoho hou ʻana i ka pahu-sizing honua. Ma kēia ala, hiki ke hoʻohana ʻia kā mākou kaila grid ma nā wahi ʻē aʻe me ke keakea ʻole.

  • $enable-grid-classesʻaʻole hoʻopau hou i ka hana ʻana o nā papa pahu. E nana #29146.

  • Hoʻohou i ka make-colmixin i paʻamau i nā kolamu like ʻole me ka nui ʻole.

Maʻiʻo, Reboot, etc

  • Ua hoʻohana ʻia ʻo RFS ma ka paʻamau. ʻO nā poʻomanaʻo e hoʻohana ana i kafont-size()mixin e hoʻoponopono ʻokoʻa i ko lākoufont-sizeʻano me ka viewport. Ua koho mua ʻia kēia hiʻohiʻona me v4.

  • HaʻihaʻiHoʻoponopono i kā mākou hōʻike kiʻi kiʻi e hoʻololi i kā mākou mau $display-*loli a me kahi $display-font-sizespalapala Sass. Wehe pū kekahi i nā ʻano $display-*-weighthoʻololi hoʻokahi no hoʻokahi s i $display-font-weighthoʻoponopono font-sizeʻia.

  • Hoʻohui ʻia ʻelua .display-*nui poʻomanaʻo hou, .display-5a me .display-6.

  • Kuhi ʻia nā loulou e ka paʻamau (ʻaʻole ma ka hover wale nō), ke ʻole lākou he ʻāpana o nā ʻāpana kikoʻī.

  • Nā papa ʻaina i hoʻolālā hou ʻia e hōʻoluʻolu i ko lākou mau ʻano a kūkulu hou iā lākou me nā mea hoʻololi CSS no ka hoʻomalu hou ʻana i ke ʻano.

  • HaʻihaʻiʻAʻole hoʻoili ʻia nā ʻano ʻano i nā papa ʻaina.

  • Haʻihaʻi .thead-lighta .thead-darkhoʻokuʻu ʻia no nā .table-*papa ʻokoʻa i hiki ke hoʻohana ʻia no nā mea papa ʻaina āpau ( thead, tbody, tfoot, tr, tha me td).

  • HaʻihaʻiHoʻololi table-row-variant()hou ʻia ka mixin a ʻae i nā ʻāpana ʻelua table-variant()wale nō: $color(inoa kala) a me $value(code kala). Ua helu 'akomi 'ia ke kala palena a me ka leo ma muli o nā mea ho'ololi o ka papa.

  • E hoʻokaʻawale i nā mea hoʻololi padding cell table i loko -ya -x.

  • HaʻihaʻiPapa haʻalele .pre-scrollable. E nana #29135

  • Haʻihaʻi .text-*ʻAʻole hoʻohui hou nā mea hoʻohana i ka hover a me ka nānā ʻana i nā loulou. .link-*Hiki ke hoʻohana ʻia nā papa kōkua. E nana #29267

  • HaʻihaʻiPapa haʻalele .text-justify. E nana #29793

  • Haʻihaʻi <hr>hoʻohana nā mea i kēia manawa heightma mua o borderke kākoʻo maikaʻi ʻana i ke sizeʻano. Hiki i kēia ke hoʻohana i nā pono hana padding e hana i nā mea hoʻokaʻawale mānoanoa (e laʻa, <hr class="py-1">).

  • padding-leftHoʻihoʻi hou i ka pae paʻamau <ul>a me <ol>nā mea mai ka polokalamu kele pūnaewele 40pxi 2rem.

  • Hoʻohui ʻia $enable-smooth-scroll, e pili ana scroll-behavior: smoothi ka honua holoʻokoʻa—koe wale nō nā mea hoʻohana e noi ana i ka neʻe hōʻemi ma o prefers-reduced-motionka nīnau media. E nana #31877

RTL

  • Ua kapa hou ʻia nā ʻano hoʻololi kikoʻī, nā pono, a me nā mixins no ka hoʻohana ʻana i nā waiwai kūpono e like me nā mea i loaʻa ma nā hoʻonohonoho flexbox—e laʻa, starta endma kahi o lefta right.

Nā palapala

  • Hoʻohui ʻia nā palapala lana hou! Ua paipai mākou i ka laʻana o nā lepili lana i nā ʻāpana puka kākoʻo piha. E ʻike i ka ʻaoʻao lepili lana hou.

  • Haʻihaʻi Hoʻohui ʻia nā ʻano mea ʻōiwi a me nā mea maʻamau. Ua hoʻohui ʻia nā pahu pahu, nā lekiō, nā koho, a me nā mea hoʻokomo ʻē aʻe i loaʻa nā papa ʻōiwi a maʻamau ma v4. I kēia manawa, ʻaneʻane maʻamau a pau kā mākou ʻano mea, ʻo ka hapa nui me ka ʻole o ka HTML maʻamau.

    • .custom-checki kēia manawa .form-check.
    • .custom-check.custom-switchi kēia manawa .form-check.form-switch.
    • .custom-selecti kēia manawa .form-select.
    • .custom-filea .form-fileua pani ʻia e nā ʻano maʻamau ma luna o .form-control.
    • .custom-rangei kēia manawa .form-range.
    • Haʻalele ʻia ka ʻōiwi .form-control-filea me .form-control-range.

  • HaʻihaʻiHāʻule .input-group-appenda .input-group-prepend. Hiki iā ʻoe ke hoʻohui i nā pihi a .input-group-textme nā keiki pololei o nā pūʻulu hoʻokomo.

  • Ua hoʻopaʻa hope ʻia ka radius palena ʻole lōʻihi ma ka pūʻulu hoʻokomo me ka hōʻoia hōʻoia ʻana ma o ka hoʻohui ʻana i kahi .has-validationpapa hou i nā pūʻulu hoʻokomo me ka hōʻoia.

  • Haʻihaʻi Hoʻokuʻu ʻia nā papa hoʻolālā kikoʻī no kā mākou ʻōnaehana mānoanoa. E hoʻohana i kā mākou mānoanoa a me nā pono hana ma kahi o .form-group, .form-row, a i ʻole .form-inline.

  • HaʻihaʻiPono nā lepili palapala i kēia manawa .form-label.

  • Haʻihaʻi .form-textʻaʻole i hoʻonohonoho hou display, e ʻae iā ʻoe e hana i ka laina a i ʻole ka poloka i ke kikokikona kōkua e like me kou makemake ma ka hoʻololi ʻana i ka mea HTML.

  • ʻAʻole hoʻohana hou ʻia nā kiʻi hōʻoia i <select>s me multiple.

  • Hoʻonohonoho hou ʻia nā faila Sass kumu ma lalo o scss/forms/, me nā ʻano hui hoʻokomo.

Nā ʻāpana

  • ʻO nā waiwai i hui pū ʻia no nā mākaʻikaʻi, nā ʻāpana palaoa, nā kāleka, nā hāʻule iho, nā pūʻulu papa inoa, nā modals padding, nā popovers, a me nā ʻōlelo aʻoaʻo e hoʻokumu ʻia ma kā mākou ʻano $spacer. E nana #30564 .

Accordion

ʻO nā makaʻala

  • Loaʻa i nā mākaʻi nā hiʻohiʻona me nā kiʻi .

  • Wehe ʻia nā ʻano maʻamau no nā <hr>s i kēlā me kēia makaʻala no ka mea ua hoʻohana mua lākou currentColor.

Nā hōʻailona

  • HaʻihaʻiHoʻokuʻu i .badge-*nā papa waihoʻoluʻu a pau no nā pono hope (e laʻa, hoʻohana .bg-primaryma kahi o .badge-primary).

  • HaʻihaʻiHāʻule - hoʻohana .badge-pilli ka .rounded-pillpono.

  • HaʻihaʻiWehe ʻia nā ʻano hover a me ka nānā ʻana no nā mea <a>a me <button>nā mea.

  • Hoʻonui ʻia ka padding paʻamau no nā hōʻailona mai .25em/ .5ema .35em/ .65em.

  • Ua maʻalahi ka hiʻohiʻona paʻamau o nā ʻōpala berena ma ka wehe ʻana i ka padding, background-color, a me border-radius.

  • Hoʻohui i ka waiwai maʻamau CSS hou --bs-breadcrumb-dividerno ka hana maʻalahi me ka ʻole e hoʻopili hou i ka CSS.

Nā pihi

  • Haʻihaʻi ʻAʻole koi hou nā pihi hoʻololi , me nā pahu pahu a i ʻole nā ​​lekiō, iā JavaScript a loaʻa iā ia kahi hōʻailona hou. ʻAʻole mākou e koi hou i kahi mea ʻōwili, hoʻohui.btn-checki ka<input>, a hui pū me nā.btnpapa ma ka<label>. E nana #30650 . Ua neʻe nā palapala no kēia mai kā mākou ʻaoʻao ʻaoʻao i ka ʻāpana Forms hou.

  • Haʻihaʻi Hoʻokuʻu .btn-blockʻia no nā pono hana. Ma kahi o ka hoʻohana ʻana .btn-blockma ka .btn, e kāʻei i kāu mau pihi me .d-gridkahi .gap-*pono e hoʻokaʻawale iā lākou inā pono. E hoʻololi i nā papa pane no ka mana hou aku ma luna o lākou. E heluhelu i nā palapala no kekahi mau laʻana.

  • Hoʻohou i kā mākou hui button-variant()a me button-outline-variant()nā mixins e kākoʻo i nā ʻāpana ʻē aʻe.

  • Nā pihi hou e hōʻoia i ka hoʻonui ʻana i ka ʻokoʻa ma ka hover a me nā kūlana hana.

  • Loaʻa nā pihi kīnā ʻole i kēia manawa pointer-events: none;.

Kāleka

  • HaʻihaʻiHoʻokuʻu .card-deckʻia i ka makemake o kā mākou paena. E kāʻei i kāu mau kāleka i nā papa kolamu a hoʻohui i kahi .row-cols-*pahu makua e hana hou i nā papa kāleka (akā me ka mana ʻoi aʻe ma luna o ka alignment pane).

  • HaʻihaʻiHoʻokuʻu .card-columnsʻia i ka makemake o Masonry. E nana #28922 .

  • HaʻihaʻiUa hoʻololi ʻia ka .cardaccordion me kahi ʻāpana Accordion hou .

  • Hoʻohui ʻia nā ʻano hou .carousel-darkno nā kikokikona ʻeleʻele, nā mana, a me nā hōʻailona (maikaʻi no nā kāʻei māmā).

  • Hoʻololi i nā kiʻi chevron no nā mana carousel me nā SVG hou mai Bootstrap Icons .

Pani pani

  • HaʻihaʻiKapa .closehou .btn-closeʻia i ka inoa maʻamau.

  • Ke hoʻohana nei nā pihi pani i kahi background-image(SVG i hoʻokomo ʻia) ma kahi o &times;ka HTML, e ʻae ai i ka hana maʻalahi me ka ʻole e hoʻopā i kāu markup.

  • Hoʻohui ʻia kahi ʻano hou .btn-close-whitee hoʻohana filter: invert(1)ai i hiki ke hoʻokaʻawale i nā kiʻi ʻokoʻa kiʻekiʻe e kūʻē i nā kumu ʻeleʻele.

Hāneʻe

  • Wehe ʻia ka heleuma ʻōwili no nā accordions.

  • Hoʻohui ʻia nā ʻano ʻokoʻa hou .dropdown-menu-darka me nā mea hoʻololi e pili ana no ka hāʻule ʻana o ka pōʻeleʻele.

  • Hoʻohui ʻia nā mea hoʻololi hou no $dropdown-padding-x.

  • Ua pōʻeleʻele ka mea hoʻokaʻawale i lalo no ka hoʻomaikaʻi ʻana i ka ʻokoʻa.

  • HaʻihaʻiHoʻomaka ʻia nā hanana a pau no ka hāʻule iho i lalo ma ke pihi hoʻokuʻu iho i lalo a laila huʻi ʻia i ka mea makua.

  • Loaʻa i nā menus Dropdown kahi ʻano data-bs-popper="static"i hoʻonohonoho ʻia i ka wā e paʻa ai ke kūlana o ka hāʻule i lalo a data-bs-popper="none"i ka wā e hāʻule ai i ka navbar. Hoʻohui ʻia kēia e kā mākou JavaScript a kōkua iā mākou e hoʻohana i nā ʻano kūlana maʻamau me ka ʻole e hoʻopilikia i ke kūlana o Popper.

  • HaʻihaʻiKoho hāʻule no ka plugin dropdown flipi makemake i ka hoʻonohonoho Popper maoli. Hiki iā ʻoe ke hoʻopau i ka hana flipping ma ka hāʻawi ʻana i kahi ʻāpana ʻole no fallbackPlacementske koho i ka hoʻololi hoʻololi.

  • Hiki ke kaomi ʻia nā menus dropdown me kahi autoClosekoho hou e mālama ai i ke ʻano pili kaʻa . Hiki iā ʻoe ke hoʻohana i kēia koho no ka ʻae ʻana i ke kaomi i loko a i waho paha o ka papa kuhikuhi hāʻule i mea e hoʻopili ai.

  • Ke kākoʻo nei nā hāʻule iho i nā .dropdown-items i ʻōwili ʻia i <li>s.

ʻO Jumbotron

Papa papa inoa

  • Hoʻohui ʻia nā nullmea hoʻololi hou no font-size, font-weight, color, a :hover colori ka .nav-linkpapa.
  • HaʻihaʻiPono nā Navbars i kahi pahu i loko (e hoʻomaʻamaʻa maʻalahi i nā koi spacing a koi ʻia CSS).

Offcanvas

Ka helu helu

  • Hiki ke hoʻololi ʻia nā loulou ʻaoʻao i margin-leftnā kihi a pau ke kaʻawale ʻana mai kekahi i kekahi.

  • Hoʻohui transitionʻia nā s i nā loulou pagination.

Popovers

  • HaʻihaʻiKapa .arrowhou ʻia i .popover-arrowloko o kā mākou papa kuhikuhi popover paʻamau.

  • Kapa whiteListhou ʻia ke koho i allowList.

Nā milo

  • Hoʻohanohano nā Spinners i kēia manawa prefers-reduced-motion: reducema ka hoʻolohi ʻana i nā animations. E nana #31882 .

  • Hoʻomaikaʻi ʻia ka hoʻopololei ʻana i ka spinner.

Toasts

  • Hiki ke hoʻonoho ʻia nā toasts i kēia manawa .toast-containerme ke kōkua o nā pono hoʻonohonoho .

  • Hoʻololi ʻia ka lōʻihi o ka toast paʻamau i 5 kekona.

  • Wehe ʻia overflow: hiddenmai nā toasts a hoʻololi ʻia me nā border-radiuss kūpono me calc()nā hana.

Mea kōkua

  • HaʻihaʻiHoʻololi .arrowhou ʻia i .tooltip-arrowloko o kā mākou mea hoʻohālike paʻamau.

  • HaʻihaʻifallbackPlacementsHoʻololi ʻia ka waiwai paʻamau no ka ['top', 'right', 'bottom', 'left']hoʻokomo maikaʻi ʻana o nā mea popper.

  • HaʻihaʻiKapa whiteListhou ʻia ke koho i allowList.

Nā pono hana

  • HaʻihaʻiHoʻololi hou i kekahi mau mea pono e hoʻohana i nā inoa waiwai kūpono ma mua o nā inoa kuhikuhi me ka hoʻohui ʻana o ke kākoʻo RTL:

    • Kapa hou ʻia .left-*a .right-*i .start-*a .end-*.
    • Kapa hou ʻia .float-lefta .float-righti .float-starta .float-end.
    • Kapa hou ʻia .border-lefta .border-righti .border-starta .border-end.
    • Kapa hou ʻia .rounded-lefta .rounded-righti .rounded-starta .rounded-end.
    • Kapa hou ʻia .ml-*a .mr-*i .ms-*a .me-*.
    • Kapa hou ʻia .pl-*a .pr-*i .ps-*a .pe-*.
    • Kapa hou ʻia .text-lefta .text-righti .text-starta .text-end.

  • HaʻihaʻiHoʻopaʻa ʻia nā palena ʻino ma ka paʻamau.

  • Hoʻohui ʻia ka .bg-bodypapa hou no ka hoʻonohonoho wikiwiki ʻana i ke <body>kāʻei ʻana i nā mea ʻē aʻe.

  • Hoʻohui ʻia nā pono kūlana hou no top, right, bottom, a me left. Aia nā waiwai i ka 0, 50%, a 100%no kēlā me kēia waiwai.

  • Hoʻohui ʻia nā mea hou .translate-middle-xa me .translate-middle-ynā pono hana i nā mea i hoʻonohonoho pono ʻia a i ʻole pololei.

  • Hoʻohui ʻia nā border-widthpono hana hou .

  • HaʻihaʻiKapa .text-monospacehou ʻia i .font-monospace.

  • HaʻihaʻiWehe .text-hideʻia ʻo ia ke ʻano hana kahiko no ka hūnā ʻana i nā kikokikona ʻaʻole pono e hoʻohana hou ʻia.

  • Hoʻohui .fs-*ʻia nā pono hana no font-sizenā pono hana (me ka RFS i hiki). Hoʻohana kēia mau mea i ka pālākiō like me nā poʻomanaʻo paʻamau o HTML (1-6, nui a liʻiliʻi), a hiki ke hoʻololi ʻia ma o ka palapala ʻāina Sass.

  • HaʻihaʻiHoʻololi hou ʻia .font-weight-*nā pono hana .fw-*no ka pōkole a me ke kūlike.

  • HaʻihaʻiHoʻololi hou ʻia .font-style-*nā pono hana .fst-*no ka pōkole a me ke kūlike.

  • Hoʻohui .d-gridʻia e hōʻike i nā pono hana a me nā gappono hou ( .gap) no ka CSS Grid a me nā hoʻolālā flexbox.

  • HaʻihaʻiWehe ʻia .rounded-sma rounded-lg, a hoʻokomo i kahi pālākiō hou o nā papa, .rounded-0i .rounded-3. E nana #31687 .

  • Hoʻohui ʻia nā line-heightpono hana hou: .lh-1, .lh-sm, .lh-basea .lh-lg. E nana maanei .

  • Ua hoʻoneʻe i ka .d-nonepono ma kā mākou CSS e hāʻawi i ke kaumaha ma mua o nā pono hōʻike ʻē aʻe.

  • Hoʻonui i ke .visually-hidden-focusablekōkua e hana pū i nā ipu, me ka hoʻohana ʻana i :focus-within.

Nā mea kōkua

  • Haʻihaʻi Ua kapa hou ʻia nā mea kōkua hoʻopili pane i ka ratio o nā mea kōkua me nā inoa papa hou a me nā ʻano i hoʻomaikaʻi ʻia, a me kahi hoʻololi CSS kōkua.

    • Ua kapa hou ʻia nā papa e hoʻololi byi xka lākiō hiʻohiʻona. Eia kekahi laʻana, .ratio-16by9i kēia manawa .ratio-16x9.
    • Ua hoʻokuʻu mākou i ka .embed-responsive-itemmea koho pūʻulu a me ka mea koho no ka mea .ratio > *koho maʻalahi. ʻAʻohe papa e pono ai, a ke hana nei ka mea kōkua ratio me kekahi mea HTML.
    • Ua $embed-responsive-aspect-ratioskapa hou ʻia ka palapala ʻāina ʻo Sass $aspect-ratiosa ua maʻalahi kona mau waiwai e hoʻokomo i ka inoa papa a me ka pākēneka e like me ka key: valuepālua.
    • Hoʻokumu ʻia nā ʻano hoʻololi CSS a hoʻokomo ʻia no kēlā me kēia waiwai ma ka palapala ʻāina Sass. Hoʻololi i ka ʻano --bs-aspect-ratiohoʻololi ma ka .ratioe hana i kekahi lākiō hiʻohiʻona maʻamau .

  • Haʻihaʻi ʻO nā papa "heluhelu maka" i kēia manawa he mau papa "huna ʻike ʻia" .

    • Ua hoʻololi i ka faila Sass mai scss/helpers/_screenreaders.scsskascss/helpers/_visually-hidden.scss
    • Kapa hou ʻia .sr-onlya .sr-only-focusablei .visually-hiddena.visually-hidden-focusable
    • Hoʻololi ʻia sr-only()a sr-only-focusable()hui pū ʻia i visually-hidden()a me visually-hidden-focusable().

  • bootstrap-utilities.cssi kēia manawa pū kekahi me kā mākou mau kōkua. ʻAʻole pono e hoʻokomo hou ʻia nā mea kōkua i nā hana maʻamau.

JavaScript

  • Hoʻopau i ka hilinaʻi jQuery a kākau hou i nā plugins i loko o ka JavaScript maʻamau.

  • HaʻihaʻiHoʻokaʻawale ʻia nā ʻikepili ʻikepili no nā plugins JavaScript āpau e kōkua i ka hoʻokaʻawale ʻana i ka hana Bootstrap mai nā ʻaoʻao ʻekolu a me kāu code ponoʻī. No ka laʻana, hoʻohana mākou data-bs-togglema kahi o data-toggle.

  • Hiki i nā plugins āpau ke ʻae i kahi mea koho CSS ma ke ʻano he hoʻopaʻapaʻa mua. Hiki iā ʻoe ke hāʻawi i kahi mea DOM a i ʻole kekahi mea koho CSS kūpono e hana i kahi hiʻohiʻona hou o ka plugin:

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

  • popperConfighiki ke hoʻoholo ʻia ma ke ʻano he hana e ʻae i ka config Popper paʻamau o Bootstrap ma ke ʻano he hoʻopaʻapaʻa, i hiki iā ʻoe ke hoʻohui i kēia hoʻonohonoho paʻamau i kou ala. Pili i nā hāʻule iho, popovers, a me nā mea hana.

  • Hoʻololi ʻia ka waiwai paʻamau no ka hoʻokomo ʻana fallbackPlacementsi ['top', 'right', 'bottom', 'left']nā mea Popper. Pili i nā hāʻule iho, popovers, a me nā mea hana.

  • Wehe ʻia ka underscore mai nā ʻano static ākea e like me _getInstance()→ getInstance().