Pagbalhin sa v5
Pagsubay ug pagrepaso sa mga pagbag-o sa Bootstrap source file, dokumentasyon, ug mga sangkap aron matabangan ka nga molalin gikan sa v4 hangtod sa v5.
Mga pagsalig
- Gihulog ang jQuery.
- Gi-upgrade gikan sa Popper v1.x ngadto sa Popper v2.x.
- Gipulihan ang Libsass sa Dart Sass tungod kay ang among Sass compiler nga gihatag sa Libsass wala na gigamit.
- Migrate gikan sa Jekyll ngadto sa Hugo alang sa pagtukod sa among dokumentasyon
Suporta sa browser
- Gihulog ang Internet Explorer 10 ug 11
- Gihulog ang Microsoft Edge <16 (Legacy Edge)
- Gihulog ang Firefox <60
- Gihulog ang Safari < 12
- Gihulog ang iOS Safari <12
- Gihulog ang Chrome <60
Mga pagbag-o sa dokumentasyon
- Gidisenyo pag-usab nga homepage, layout sa mga dokumento, ug footer.
- Gidugang bag-ong Parcel nga giya .
- Gidugang ang bag-ong I-customize nga seksyon , gipuli ang panid sa Theming sa v4 , nga adunay bag-ong mga detalye sa Sass, mga kapilian sa pag-configure sa kalibutan, mga laraw sa kolor, mga variable sa CSS, ug uban pa.
- Gi-organisar pag-usab ang tanang dokumentasyon sa porma ngadto sa bag-ong seksyon sa Mga Porma , gibahin ang sulod ngadto sa mas nakapokus nga mga panid.
- Sa susama, gi-update ang seksyon sa Layout , aron mas klaro ang sulud sa grid.
- Gibag-o ang ngalan nga "Navs" nga panid sa sangkap sa "Navs & Tabs".
- Giusab ang ngalan nga "Checks" nga panid ngadto sa "Checks & radios".
- Gidisenyo pag-usab ang navbar ug gidugang ang usa ka bag-ong subnav aron mas dali ang paglibot sa among mga site ug mga bersyon sa doc.
- Gidugang bag-ong keyboard shortcut para sa search field: Ctrl + /.
Sass
-
Among gitangtang ang default nga Sass map merges aron mas sayon ang pagtangtang sa mga sobra nga kantidad. Hinumdumi nga kinahanglan nimong ipasabut ang tanan nga mga kantidad sa mga mapa sa Sass sama sa
$theme-colors
. Tan-awa kung giunsa ang pag-atubang sa mga mapa sa Sass . -
PagbuwagGibag -o ang ngalan
color-yiq()
sa function ug may kalabutan nga mga variable sacolor-contrast()
ingon nga wala na kini kalabutan sa colorspace sa YIQ. Tan-awa ang #30168.$yiq-contrasted-threshold
giusab ang ngalan sa$min-contrast-ratio
.$yiq-text-dark
ug$yiq-text-light
giilisan ug ngalan sa$color-contrast-dark
ug$color-contrast-light
.
-
PagbuwagAng mga parameter sa pagsagol sa pangutana sa media nausab para sa mas lohikal nga pamaagi.
media-breakpoint-down()
naggamit sa breakpoint mismo imbes sa sunod nga breakpoint (pananglitan,media-breakpoint-down(lg)
imbes ngamedia-breakpoint-down(md)
target ang mga viewport nga mas gamay kay salg
).- Sa susama, ang ikaduha nga parametro sa
media-breakpoint-between()
naggamit usab sa breakpoint sa iyang kaugalingon imbes sa sunod nga breakpoint (pananglitan,media-between(sm, lg)
imbes ngamedia-breakpoint-between(sm, md)
target viewports tali sasm
uglg
).
-
PagbuwagGikuha ang mga estilo sa pag-imprinta ug
$enable-print-styles
variable. Ang mga klase sa pagpakita sa pag-imprinta anaa pa. Tan-awa ang #28339 . -
PagbuwagGihulog
color()
ang ,theme-color()
, uggray()
naglihok pabor sa mga variable. Tan-awa ang #29083 . -
PagbuwagGibag -o ang ngalan
theme-color-level()
sa functioncolor-level()
ug karon modawat sa bisan unsang kolor nga gusto nimo imbis nga mga$theme-color
kolor lamang. Tan-awa ang #29083 Bantayi:color-level()
sa ulahi gihulog sav5.0.0-alpha3
. -
PagbuwagGiusab ang ngalan
$enable-prefers-reduced-motion-media-query
ug$enable-pointer-cursor-for-buttons
sa$enable-reduced-motion
ug$enable-button-pointers
sa mubo. -
PagbuwagGikuha ang
bg-gradient-variant()
mixin. Gamita ang.bg-gradient
klase aron idugang ang mga gradient sa mga elemento imbes sa mga nahimo nga.bg-gradient-*
klase. -
Pagbuwag Gitangtang ang kaniadto wala na gigamit nga mga mixin:
hover
,hover-focus
,plain-hover-focus
, ughover-focus-active
float()
form-control-mixin()
nav-divider()
retina-img()
text-hide()
(gihulog usab ang kauban nga klase sa utility,.text-hide
)visibility()
form-control-focus()
-
PagbuwagGibag -o ang ngalan
scale-color()
nga function aronshift-color()
malikayan ang pagbangga sa kaugalingon nga function sa pag-scale sa kolor ni Sass. -
box-shadow
mixins karon nagtugot sanull
mga bili ug dropnone
gikan sa daghang mga argumento. Tan-awa ang #30394 . -
Ang
border-radius()
mixin karon adunay usa ka default nga kantidad.
Sistema sa kolor
-
Ang sistema sa kolor nga nagtrabaho
color-level()
ug$theme-color-interval
gitangtang pabor sa usa ka bag-ong sistema sa kolor. Ang tananlighten()
ugdarken()
mga gimbuhaton sa among codebase gipulihantint-color()
ugshade-color()
. Kini nga mga gimbuhaton magsagol sa kolor sa puti o itom imbis nga usbon ang kahayag niini sa usa ka piho nga kantidad. Angshift-color()
mag-tint o mag-shade sa usa ka kolor depende kung positibo o negatibo ang parameter sa gibug-aton niini. Tan-awa ang #30622 para sa dugang nga mga detalye. -
Gidugang ang bag-ong mga tints ug shades alang sa matag kolor, naghatag siyam ka separado nga mga kolor sa matag base nga kolor, isip bag-ong Sass variables.
-
Gipauswag nga kalainan sa kolor. Gibunggo ang contrast ratio sa kolor gikan sa 3:1 ngadto sa 4.5:1 ug gi-update ang blue, green, cyan, ug pink nga mga kolor aron maseguro ang WCAG 2.1 AA contrast. Giusab usab ang among kolor nga contrast color gikan
$gray-900
sa$black
. -
Aron masuportahan ang among sistema sa kolor, gidugang namo ang bag-ong kostumbre
tint-color()
ugshade-color()
mga gimbuhaton aron isagol ang among mga kolor sa hustong paagi.
Mga update sa grid
-
Bag-ong breakpoint! Gidugang bag-ong
xxl
breakpoint alang sa1400px
ug pataas. Walay mga pagbag-o sa tanan nga uban pang mga breakpoint. -
Gipaayo nga mga kanal. Ang mga kanal gipahimutang na karon sa rem, ug mas hiktin kay sa v4 (
1.5rem
, o mga24px
, paubos gikan sa30px
). Gipahiangay niini ang mga gutter sa among grid system sa among mga spacing utilities.- Gidugang ang bag-ong klase sa gutter (
.g-*
,.gx-*
, ug.gy-*
) aron makontrol ang horizontal/vertical gutters, horizontal gutters, ug vertical gutters. - PagbuwagGibag -o ang ngalan
.no-gutters
sa.g-0
aron ipares ang bag-ong mga gamit sa gutter.
- Gidugang ang bag-ong klase sa gutter (
-
Wala na
position: relative
magamit ang mga kolum, mao nga kinahanglan nimong idugang.position-relative
ang pipila ka mga elemento aron mapasig-uli kana nga pamatasan. -
PagbuwagGihulog ang daghang mga
.order-*
klase nga kanunay wala magamit. Naghatag lang kami karon.order-1
sa.order-5
gawas sa kahon. -
PagbuwagGihulog ang
.media
sangkap tungod kay kini dali nga makopya sa mga gamit. Tan-awa ang #28265 ug ang flex utilities nga panid alang sa usa ka pananglitan . -
Pagbuwag
bootstrap-grid.css
karon magamit lamangbox-sizing: border-box
sa kolum imbes nga i-reset ang global box-sizing. Niining paagiha, ang among mga istilo sa grid mahimong magamit sa daghang mga lugar nga wala’y pagpanghilabot. -
$enable-grid-classes
dili na disable ang henerasyon sa mga klase sa sudlanan. Tan-awa ang #29146. -
Gi-update ang
make-col
mixin sa default sa parehas nga mga kolum nga wala’y piho nga gidak-on.
Content, Reboot, ug uban pa
-
Ang RFS gipalihok na pinaagi sa default. Ang mga ulohan nga naggamit sa
font-size()
mixin awtomatik nga mag-adjust sa ilangfont-size
gidak-on sa viewport. Kini nga bahin kaniadto nag-opt-in sa v4. -
PagbuwagGi-overhaul ang among gipakita nga typography aron ilisan ang among
$display-*
mga variable ug gamit ang usa ka$display-font-sizes
mapa sa Sass. Gikuha usab ang indibidwal nga mga$display-*-weight
variable alang sa usa$display-font-weight
ug gibag-ofont-size
nga s. -
Gidugang ang duha ka bag-ong
.display-*
gidak-on sa ulohan,.display-5
ug.display-6
. -
Ang mga link gilinya pinaagi sa default (dili lang sa hover), gawas kung kini bahin sa piho nga mga sangkap.
-
Gidisenyo pag-usab nga mga lamesa aron i-refresh ang ilang mga istilo ug tukuron kini pag-usab gamit ang mga variable sa CSS alang sa dugang nga pagkontrol sa pag-istilo.
-
PagbuwagAng mga nested table dili na makapanunod sa mga estilo.
-
Pagbuwag
.thead-light
ug.thead-dark
gihulog pabor sa lain-.table-*
laing klase nga mahimong gamiton alang sa tanang elemento sa lamesa (thead
,tbody
,tfoot
,tr
,th
ugtd
). -
PagbuwagAng
table-row-variant()
mixin gipangalantable-variant()
ug gidawat lamang ang 2 nga mga parameter:$color
(kolor nga ngalan) ug$value
(kode sa kolor). Ang kolor sa utlanan ug mga kolor sa accent awtomatikong kalkulado base sa mga variable sa table factor. -
Bahina ang mga variable sa table cell padding ngadto sa
-y
ug-x
. -
PagbuwagNahulog
.pre-scrollable
ang klase. Tan-awa ang #29135 -
Pagbuwag
.text-*
Ang mga utilities dili na makadugang sa hover ug focus nga mga estado sa mga link..link-*
Ang mga klase sa katabang mahimong magamit sa baylo. Tan-awa ang #29267 -
PagbuwagNahulog
.text-justify
ang klase. Tan-awa ang #29793 -
Pagbuwag
<hr>
gigamit karon ang mga elementoheight
imbisborder
aron mas masuportahan angsize
hiyas. Gitugotan usab niini ang paggamit sa mga kagamitan sa padding aron makahimo og mas baga nga mga divider (pananglitan,<hr class="py-1">
). -
I- reset ang default pinahigda
padding-left
sa<ul>
ug ang<ol>
mga elemento gikan sa default sa browser40px
ngadto sa2rem
. -
Gidugang
$enable-smooth-scroll
, nga magamitscroll-behavior: smooth
sa tibuok kalibutan-gawas sa mga tiggamit nga nangayo og pagkunhod sa paglihok pinaagiprefers-reduced-motion
sa pangutana sa media. Tan-awa ang #31877
RTL
- Ang pinahigda nga direksyon espesipikong mga baryable, mga utilities, ug mga mixin ang tanan giilisan sa ngalan sa paggamit sa lohikal nga mga kabtangan sama niadtong makita sa flexbox layouts—eg,
start
ugend
puli saleft
ugright
.
Mga porma
-
Gidugang bag-ong naglutaw nga mga porma! Gi-promote namo ang mga Floating label nga pananglitan sa hingpit nga suportadong mga sangkap sa porma. Tan-awa ang bag-ong Floating labels nga panid.
-
Pagbuwag Nahiusa nga lumad ug naandan nga mga elemento sa porma. Ang mga checkbox, radyo, pinili, ug uban pang mga input nga adunay lumad ug naandan nga mga klase sa v4 gihiusa. Karon halos tanan namong mga elemento sa porma kay bug-os nga naandan, kadaghanan wala magkinahanglan ug custom nga HTML.
.custom-check
karon.form-check
..custom-check.custom-switch
karon.form-check.form-switch
..custom-select
karon.form-select
..custom-file
ug.form-file
gipulihan sa naandang mga estilo sa ibabaw sa.form-control
..custom-range
karon.form-range
.- Nahulog nga lumad
.form-control-file
ug.form-control-range
.
-
PagbuwagNahulog
.input-group-append
ug.input-group-prepend
. Mahimo nimong idugang ang mga buton ug.input-group-text
ingon direkta nga mga bata sa mga grupo sa input. -
Ang dugay na nga Nawala nga border radius sa input nga grupo nga adunay validation feedback bug sa katapusan naayo pinaagi sa pagdugang usa ka dugang
.has-validation
nga klase sa input nga mga grupo nga adunay validation. -
Pagbuwag Gihulog ang mga klase sa layout nga espesipiko sa porma para sa among grid system. Gamita ang among grid ug mga utilities imbes nga
.form-group
,.form-row
, o.form-inline
. -
PagbuwagAng mga label sa porma karon nanginahanglan
.form-label
. -
Pagbuwag
.form-text
no longer setsdisplay
, nagtugot kanimo sa paghimo og inline o pag-block sa tabang nga teksto sumala sa imong gusto pinaagi lang sa pagbag-o sa HTML nga elemento. -
Ang mga icon sa validation wala na magamit sa
<select>
s nga adunaymultiple
. -
Gihan-ay pag-usab ang tinubdan Sass nga mga file ubos sa
scss/forms/
, lakip ang mga estilo sa grupo sa input.
Mga sangkap
- Nahiusa
padding
nga mga kantidad alang sa mga alerto, breadcrumb, kard, dropdown, lista nga mga grupo, modals, popover, ug tooltip nga ibase sa among$spacer
variable. Tan-awa ang #30564 .
Akordyon
- Gidugang bag-ong sangkap sa accordion .
Mga alerto
-
Ang mga alerto karon adunay mga pananglitan nga adunay mga icon .
-
Gitangtang ang mga kostumbre nga istilo para
<hr>
sa s sa matag alerto tungod kay gigamit na nila angcurrentColor
.
Mga badge
-
PagbuwagGihulog ang tanan
.badge-*
nga mga klase sa kolor alang sa mga gamit sa background (pananglitan, gamita.bg-primary
imbes nga.badge-primary
). -
PagbuwagNahulog
.badge-pill
— gamita hinuon ang.rounded-pill
utility. -
PagbuwagGitangtang ang hover ug focus nga mga estilo para
<a>
ug<button>
mga elemento. -
Gidugangan nga default padding alang sa mga badge gikan sa
.25em
/.5em
ngadto sa.35em
/.65em
.
Mga mumho sa pan
-
Gipasimple ang default nga hitsura sa mga breadcrumb pinaagi sa pagtangtang sa
padding
,background-color
, ugborder-radius
. -
Gidugang ang bag-ong CSS custom property
--bs-breadcrumb-divider
alang sa sayon nga pag-customize nga dili kinahanglan nga i-recompile ang CSS.
Mga butones
-
Pagbuwag I- toggle ang mga buton , nga adunay mga checkbox o radyo, wala na magkinahanglan og JavaScript ug adunay bag-ong markup. Wala na kami magkinahanglan og elemento sa pagputos, idugang
.btn-check
sa<input>
, ug ipares kini sa bisan unsang.btn
mga klase sa<label>
. Tan-awa ang #30650 . Ang mga docs para niini mibalhin gikan sa among Buttons page ngadto sa bag-ong Forms section. -
Pagbuwag Gihulog
.btn-block
alang sa mga utilities. Imbis nga gamiton.btn-block
ang.btn
, iputos ang imong mga butones.d-grid
ug usa ka.gap-*
gamit aron ibutang kini kung gikinahanglan. Pagbalhin ngadto sa mga responsive nga mga klase alang sa dugang nga pagkontrol niini. Basaha ang mga doc alang sa pipila ka mga pananglitan. -
Gi-update ang among
button-variant()
ugbutton-outline-variant()
mixins aron suportahan ang dugang nga mga parameter. -
Gi-update nga mga buton aron masiguro ang dugang nga kalainan sa hover ug aktibo nga mga estado.
-
Ang mga disabled nga buton karon adunay
pointer-events: none;
.
Kard
-
PagbuwagGihulog
.card-deck
pabor sa among grid. I-wrap ang imong mga kard sa mga klase sa kolum ug idugang ang usa ka.row-cols-*
sudlanan sa ginikanan aron maghimo pag-usab sa mga deck sa kard (apan adunay dugang nga kontrol sa pagtubag sa pag-align). -
PagbuwagGihulog
.card-columns
pabor sa Masonry. Tan-awa ang #28922 . -
PagbuwagGipulihan ang
.card
gibase nga akordyon sa usa ka bag-ong sangkap sa Accordion .
Carousel
-
Gidugang bag-ong
.carousel-dark
variant para sa itom nga teksto, mga kontrol, ug mga indikasyon (maayo alang sa mas gaan nga mga background). -
Gipulihan ang mga icon sa chevron alang sa mga kontrol sa carousel nga adunay bag-ong mga SVG gikan sa Mga Icon sa Bootstrap .
Close button
-
PagbuwagGiilisan ang ngalan
.close
sa.btn-close
para sa dili kaayo generic nga ngalan. -
Ang mga close button karon naggamit ug usa ka
background-image
(naka-embed nga SVG) imbes nga a×
sa HTML, nga nagtugot alang sa mas sayon nga pag-customize nga wala kinahanglana ang paghikap sa imong markup. -
Gidugang ang bag-ong
.btn-close-white
variant nga gigamitfilter: invert(1)
aron mahimo ang mas taas nga kalainan sa pagtangtang sa mga icon batok sa mas itom nga mga background.
Nahugno
- Gikuha ang scroll anchoring para sa mga akordyon.
Mga dropdown
-
Gidugang ang bag-ong
.dropdown-menu-dark
variant ug kaubang mga variable para sa on-demand nga dark dropdowns. -
Gidugang bag-ong variable para sa
$dropdown-padding-x
. -
Gipangitngit ang dropdown divider para sa mas maayo nga contrast.
-
PagbuwagAng tanan nga mga panghitabo alang sa dropdown karon na-trigger sa dropdown toggle button ug dayon gibuak ngadto sa ginikanan nga elemento.
-
Ang dropdown nga mga menu aduna nay
data-bs-popper="static"
set nga attribute kung ang positioning sa dropdown static ugdata-bs-popper="none"
kung ang dropdown naa sa navbar. Gidugang kini sa among JavaScript ug nagtabang kanamo sa paggamit sa naandan nga mga istilo sa posisyon nga dili makabalda sa pagposisyon sa Popper. -
PagbuwagNahulog
flip
nga kapilian alang sa dropdown plugin pabor sa lumad nga Popper configuration. Mahimo nimong i-disable ang flipping behavior pinaagi sa pagpasa sa usa ka walay sulod nga array para safallbackPlacements
opsyon sa flip modifier. -
Ang mga dropdown nga menu mahimo nang ma-click nga adunay bag-ong
autoClose
kapilian sa pagdumala sa auto close nga kinaiya . Mahimo nimong gamiton kini nga kapilian aron dawaton ang pag-klik sa sulod o sa gawas sa dropdown menu aron mahimo kini nga interactive. -
Ang mga dropdown karon nagsuporta
.dropdown-item
sa mga giputos sa<li>
s.
Jumbotron
- PagbuwagGihulog ang jumbotron component kay mahimo kining makopya sa mga utilities. Tan-awa ang among bag-ong pananglitan sa Jumbotron alang sa usa ka demo.
Ilista ang grupo
- Gidugang bag-ong
.list-group-numbered
modifier sa paglista sa mga grupo.
Navs ug tabs
- Gidugang bag-ong
null
mga variable para safont-size
,font-weight
,color
, ug:hover
color
sa.nav-link
klase.
Mga Navbar
- PagbuwagNanginahanglan na karon ang mga Navbar og sudlanan sa sulod (aron mapasayon ang mga kinahanglanon sa spacing ug gikinahanglan ang CSS).
Offcanvas
- Gidugang ang bag-ong bahin sa offcanvas .
Pagination
-
Ang mga link sa pagination karon aduna nay customizable
margin-left
nga dinamikong rounded sa tanang suok kung magbulag sa usag usa. -
Gidugang
transition
s sa mga link sa pagination.
Mga Popover
-
PagbuwagGibag
.arrow
- o ang ngalan.popover-arrow
sa among default nga template sa popover. -
Giusab ang ngalan
whiteList
nga opsyon saallowList
.
Mga spinner
-
Ang mga spinner karon nagpasidungog
prefers-reduced-motion: reduce
pinaagi sa pagpahinay sa mga animation. Tan-awa ang #31882 . -
Gipaayo ang spinner vertical alignment.
Mga toast
-
Ang mga toast mahimo nang ibutang sa usa
.toast-container
sa tabang sa mga kagamitan sa pagpoposisyon . -
Giusab ang default nga gidugayon sa toast ngadto sa 5 segundos.
-
Gikuha
overflow: hidden
gikan sa mga toast ug gipulihan sa tukma ngaborder-radius
s nga adunaycalc()
mga gimbuhaton.
Mga tooltip
-
PagbuwagGiusab
.arrow
ang ngalan.tooltip-arrow
sa among default tooltip template. -
PagbuwagAng default nga bili alang sa
fallbackPlacements
giusab ngadto['top', 'right', 'bottom', 'left']
sa mas maayo nga pagbutang sa mga elemento sa popper. -
PagbuwagGiusab ang ngalan
whiteList
nga opsyon saallowList
.
Mga gamit
-
PagbuwagGibag-o ang ngalan sa daghang mga utilities aron magamit ang mga ngalan sa lohikal nga kabtangan imbes nga mga ngalan sa direksyon uban ang pagdugang sa suporta sa RTL:
- Giusab ang ngalan
.left-*
ug.right-*
sa.start-*
ug.end-*
. - Giusab ang ngalan
.float-left
ug.float-right
sa.float-start
ug.float-end
. - Giusab ang ngalan
.border-left
ug.border-right
sa.border-start
ug.border-end
. - Giusab ang ngalan
.rounded-left
ug.rounded-right
sa.rounded-start
ug.rounded-end
. - Giusab ang ngalan
.ml-*
ug.mr-*
sa.ms-*
ug.me-*
. - Giusab ang ngalan
.pl-*
ug.pr-*
sa.ps-*
ug.pe-*
. - Giusab ang ngalan
.text-left
ug.text-right
sa.text-start
ug.text-end
.
- Giusab ang ngalan
-
PagbuwagGi-disable ang negatibo nga mga margin pinaagi sa default.
-
Gidugang ang bag-ong
.bg-body
klase alang sa dali nga pagbutang sa<body>
background sa dugang nga mga elemento. -
Gidugang bag-ong mga gamit sa posisyon para sa
top
,right
,bottom
, ugleft
. Ang mga bili naglakip sa0
,50%
, ug100%
alang sa matag kabtangan. -
Gidugang bag-o
.translate-middle-x
&.translate-middle-y
mga utilities sa horizontally o vertically center absolute/fixed positioned elements. -
Gidugang bag-ong
border-width
mga utilities . -
PagbuwagGiusab ang ngalan
.text-monospace
sa.font-monospace
. -
PagbuwagGitangtang
.text-hide
tungod kay kini usa ka karaan nga pamaagi sa pagtago sa teksto nga dili na kinahanglan gamiton. -
Gidugang
.fs-*
nga mga utilities para sa mgafont-size
utilities (nga adunay RFS enabled). Gigamit niini ang parehas nga sukod sa default nga mga ulohan sa HTML (1-6, dako hangtod gamay), ug mahimong usbon pinaagi sa mapa sa Sass. -
PagbuwagGibag-o ang ngalan
.font-weight-*
sa mga utilities sama.fw-*
sa kadali ug pagkamakanunayon. -
PagbuwagGibag-o ang ngalan
.font-style-*
sa mga utilities sama.fst-*
sa kadali ug pagkamakanunayon. -
Gidugang
.d-grid
aron ipakita ang mga utilities ug bag-ong mgagap
utilities (.gap
) para sa CSS Grid ug flexbox nga mga layout. -
PagbuwagGikuha
.rounded-sm
ugrounded-lg
, ug gipaila ang bag-ong sukdanan sa mga klase,.rounded-0
ngadto sa.rounded-3
. Tan-awa ang #31687 . -
Gidugang bag-ong
line-height
mga utilities:.lh-1
,.lh-sm
,.lh-base
ug.lh-lg
. Tan-awa dinhi . -
Gibalhin ang
.d-none
utility sa among CSS aron mahatagan kini og dugang gibug-aton kaysa ubang mga gamit sa pagpakita. -
Gipalapad ang
.visually-hidden-focusable
katabang sa pagtrabaho usab sa mga sudlanan, gamit ang:focus-within
.
Mga katabang
-
Pagbuwag Ang mga responsive embed nga mga katabang giilisan og ngalan ngadto sa ratio nga mga katabang nga adunay bag-ong mga ngalan sa klase ug gipaayo nga pamatasan, ingon man usa ka makatabang nga variable sa CSS.
- Ang mga klase giilisan og ngalan aron mausab
by
ngadtox
sa aspect ratio. Pananglitan,.ratio-16by9
karon.ratio-16x9
. - Among gihulog ang
.embed-responsive-item
ug element group selector pabor sa mas simple.ratio > *
nga selector. Wala nay klase ang gikinahanglan, ug ang ratio helper karon nagtrabaho sa bisan unsang HTML nga elemento. - Ang
$embed-responsive-aspect-ratios
mapa sa Sass giilisan og ngalan$aspect-ratios
ug ang mga bili niini gipasayon aron maapil ang ngalan sa klase ug ang porsyento isipkey: value
pares. - Ang mga variable sa CSS nahimo na karon ug gilakip alang sa matag kantidad sa mapa sa Sass. Usba ang
--bs-aspect-ratio
variable sa.ratio
aron makahimo og bisan unsang custom nga aspect ratio .
- Ang mga klase giilisan og ngalan aron mausab
-
Pagbuwag Ang mga klase sa "Screen reader" karon "gitago nga biswal" nga mga klase .
- Giusab ang Sass file gikan
scss/helpers/_screenreaders.scss
sa ngadto sascss/helpers/_visually-hidden.scss
- Giusab ang ngalan
.sr-only
ug.sr-only-focusable
sa.visually-hidden
ug.visually-hidden-focusable
- Giusab ang ngalan
sr-only()
ugsr-only-focusable()
mixins savisually-hidden()
ugvisually-hidden-focusable()
.
- Giusab ang Sass file gikan
-
bootstrap-utilities.css
karon naglakip usab sa atong mga katabang. Ang mga katabang dili na kinahanglan nga i-import sa naandan nga mga pagtukod.
JavaScript
-
Gihulog ang dependency sa jQuery ug gi-rewrote ang mga plugins nga naa sa regular nga JavaScript.
-
PagbuwagAng mga hiyas sa datos alang sa tanan nga mga plugin sa JavaScript karon gi-namespace aron makatabang sa pag-ila sa pagpaandar sa Bootstrap gikan sa mga ikatulo nga partido ug sa imong kaugalingong code. Pananglitan, atong gamiton
data-bs-toggle
imbes ngadata-toggle
. -
Ang tanan nga mga plugins mahimo nang modawat sa usa ka CSS selector isip unang argumento. Mahimo nimong ipasa ang usa ka elemento sa DOM o bisan unsang balido nga tigpili sa CSS aron makahimo usa ka bag-ong pananglitan sa plugin:
var modal = new bootstrap.Modal('#myModal') var dropdown = new bootstrap.Dropdown('[data-bs-toggle="dropdown"]')
-
popperConfig
mahimong ipasa isip function nga modawat sa default Popper config sa Bootstrap isip argumento, aron imong mahiusa kining default configuration sa imong paagi. Magamit sa mga dropdown, popover, ug tooltip. -
Ang default nga bili alang sa
fallbackPlacements
giusab ngadto['top', 'right', 'bottom', 'left']
sa mas maayo nga pagbutang sa mga elemento sa Popper. Magamit sa mga dropdown, popover, ug tooltip. -
Gikuha ang underscore gikan sa publiko nga static nga mga pamaagi sama sa
_getInstance()
→getInstance()
.