Migrating ka taa v5 la
Yɛlɛma minnu kɛra Bootstrap source files, documentation ani components kɔnɔ, olu nɔfɛ ani ka u lajɛ walasa k’i dɛmɛ ka bɔ v4 la ka taa v5 la.
Dependencies (Jɛkuluw).
- A ye jQuery bila.
- A bɛ wuli ka bɔ Popper v1.x la ka taa Popper v2.x la.
- A ye Libsass bila Dart Sass nɔ na i n'a fɔ an ka Sass compiler min dira Libsass ma o tun bɛ baara la.
- A bɔra Jekyll ka taa Hugo an ka sɛbɛnw jɔli kosɔn
Navigatɛri dɛmɛni
- A ye Internet Explorer 10 ani 11 bila
- Microsoft Edge < 16 (Edge kɔrɔlen) bɔra a la.
- Firefox < 60 bɔra a la
- Safari jiginna < 12
- A ye iOS Safari < 12 bɔ
- Chrome min bɛ jigin < 60
Sɛbɛnw bɛ fɛn caman Changer
- A daminɛna, sɛbɛnw labɛncogo ani a jukɔrɔla yɔrɔ labɛnna kokura.
- A ye Parsela gafe kura fara a kan .
- A ye Customize yɔrɔ kura fara a kan , ka v4 ka Theming ɲɛ bila a nɔ na , ni kunnafoni kuraw ye Sass kan, diɲɛ kɔnɔ sigicogo suganditaw, kulɛriw, CSS fɛn caman sɛgɛsɛgɛli, ani fɛn wɛrɛw.
- A ye sɛbɛnw bɛɛ labɛn kokura ka kɛ Sɛbɛnw yɔrɔ kura ye , ka kɔnɔkow tila ka kɛ ɲɛw ye minnu sinsinnen don kosɛbɛ.
- O cogo kelen na, Layout yɔrɔ kura ye , walasa ka grid kɔnɔkow farikolo jira ka jɛya.
- A tɔgɔ jiginna “Navs” yɔrɔ ɲɛ kan ka kɛ “Navs & Tabs” ye.
- A tɔgɔ jiginna “Checks” ɲɛ kan ka kɛ “Checks & radios” ye.
- A ye navbar labɛn kokura ani ka subnav kura dɔ fara a kan walasa ka nɔgɔya don an ka sitew ni docs versions lamini na.
- Klaviyeti surun kura farala ɲinini yɔrɔ kan: Ctrl + /.
Sass ye
-
An ye Sass map merges default ditched walasa ka nɔgɔya don nafalanw bɔli la. Aw k' a to aw hakili la sisan aw ka kan ka nafa bɛɛ ɲɛfɔ Sass karitiw kɔnɔ i n' a fɔ
$theme-colors
. Aw ye Sass kartiw kunbɛncogo lajɛ . -
Ka kariTɔgɔ wɛrɛ Kɛra
color-yiq()
baarakɛcogo ni a ɲɔgɔnna fɛn caman na ka Kɛcolor-contrast()
i n'a fɔ a tɛ tali Kɛ YIQ kulɛri-yɔrɔ la tugun. Aw ye #30168 lajɛ.$yiq-contrasted-threshold
bɛ tɔgɔ caman wɛrɛ da$min-contrast-ratio
.$yiq-text-dark
ani$yiq-text-light
u tɔgɔ caman bɛ wuli ka kɛ$color-contrast-dark
ani$color-contrast-light
.
-
Ka kariMedia query mixins paramètres ye fɛn caman Changé walasa ka fɛɛrɛ sɔrɔ min bɛ bɛn hakili ma.
media-breakpoint-down()
bɛ baara kɛ ni kariyɔrɔ yɛrɛ ye kariyɔrɔ nata nɔ na (misali la,media-breakpoint-down(lg)
sanni kamedia-breakpoint-down(md)
laɲiniw filɛlifɛnw ka dɔgɔ nilg
).- O cogo kelen na, paramɛtɛrɛ filanan in
media-breakpoint-between()
fana bɛ baara Kɛ ni kariyɔrɔ yɛrɛ ye kariyɔrɔ nata nɔ na (misali la, laɲiniw filɛliyɔrɔwmedia-between(sm, lg)
nɔ na ani ).media-breakpoint-between(sm, md)
sm
lg
-
Ka kariA bɔra sɛbɛnni kɛcogoyaw ni
$enable-print-styles
fɛn caman sɛgɛsɛgɛli la. Print display classes bɛ yen hali bi. Aw ye #28339 lajɛ . -
Ka kariDropped
color()
,theme-color()
, anigray()
functions ka ɲɛsin variables ma. Aw ye #29083 lajɛ . -
Ka kariRenamed
theme-color-level()
function tocolor-level()
ani sisan a bɛ sɔn kulɛri o kulɛri ma i b’a fɛ sanni ka kɛ$theme-color
kulɛriw dɔrɔn ye. Aw ye #29083 lajɛ :color-level()
a kɛra kɔfɛ ka bilav5.0.0-alpha3
. -
Ka kariTɔgɔ kura donna
$enable-prefers-reduced-motion-media-query
ani$enable-pointer-cursor-for-buttons
ka taa$enable-reduced-motion
ani$enable-button-pointers
ka surunya. -
Ka kariA ye
bg-gradient-variant()
mixin bɔ. Baara kɛ ni.bg-gradient
kalasi ye walasa ka gradients (gradients) fara elements (daɲɛw) kan sanni ka.bg-gradient-*
classes (kalanso) minnu bɛ sɔrɔ. -
Ka kari Mixin minnu tun ma deli ka kɛ fɔlɔ, olu bɔra:
hover
,hover-focus
,plain-hover-focus
, anihover-focus-active
float()
form-control-mixin()
nav-divider()
retina-img()
text-hide()
(a fana ye nafabɔ-kalasi min bɛ tali kɛ a la, o bɔ yen,.text-hide
)visibility()
form-control-focus()
-
Ka kariTɔgɔ
scale-color()
wɛrɛ da baarakɛcogo kan walasashift-color()
ka Sass yɛrɛ ka kulɛri sɛgɛsɛgɛli baarakɛcogo bali ka ɲɔgɔn sɔrɔ. -
box-shadow
mixins sisan bɛ sira dinull
nafaw ma ani ka jiginnone
ka bɔ dalilu caman na. Aw ye #30394 lajɛ . -
Mixin
border-radius()
sisan bɛ ni default value ye.
Kulɛriw sigicogo
-
Kulɛri siratigɛ min ye baara Kɛ ni
color-level()
ani$theme-color-interval
a Bɔra ka Kɛ kulɛri kura sigicogo nɔfɛ. Bɛɛlighten()
nidarken()
baarakɛcogo minnu bɛ an ka codebase kɔnɔ olu bɛ bila u nɔ na nitint-color()
anishade-color()
. O baara ninnu bɛna kulɛri ɲagami ni finman walima nɛrɛmuguma ye sanni k’a nɔgɔya caman Changer ni hakɛ latigɛlen ye. Ashift-color()
bɛna kulɛri dɔ tin walima ka a bonya ka kɛɲɛ ni a girinya paramɛtiri ye ko ɲuman ye walima ko jugu ye. Aw ye #30622 lajɛ walasa ka kunnafoni wɛrɛw sɔrɔ . -
A ye tintin ni biɲɛ kura fara a kan kulɛri kelen-kelen bɛɛ la, ka kulɛri danfaralen kɔnɔntɔn di basigi kulɛri kelen-kelen bɛɛ ma, i n’a fɔ Sass fɛn kuraw.
-
Kulɛriw danfara ɲɛnabɔra. Kulɛri danfara hakɛ min bɛ bugɔ ka bɔ 3:1 na ka se 4,5:1 ma ani kulɛri bulu, wuluwulu, siyan ani pinki kurayali walasa ka WCAG 2.1 AA danfara sabati. Fana an ye an ka kulɛri danfara kulɛri Changé ka bɔ
$gray-900
ka taa$black
. -
Walasa k’an ka kulɛriw sigicogo dɛmɛ, an ye laadalakow
tint-color()
nishade-color()
baarakɛcogo kura dɔw fara a kan walasa k’an ka kulɛriw ɲagami ka ɲɛ.
Grid kurayali
-
Breakpoint kura!
xxl
A ye breakpoint kura fara a kan1400px
ka taa san fɛ. Yɛlɛma si ma kɛ kariyɔrɔ tɔw bɛɛ la. -
Gutters (jibolisiraw) minnu ɲɛnabɔra. Sisan, gutɛriw bɛ sigi rems kɔnɔ, wa u ka surun ka tɛmɛ v4 kan (
1.5rem
, walima24px
, ka jigin ka bɔ30px
). O b’a to an ka grid system ka gutters ni an ka spacing utilities bɛ bɛn ɲɔgɔn ma.- A ye jibolisiraw kalasi kura (
.g-*
,.gx-*
, ani.gy-*
) fara a kan walasa ka jibolisiraw jɔlenw/jiginnenw, jibolisiraw jɔlenw, ani jibolisiraw jɔlenw kɔlɔsi. - Ka kariA tɔgɔ jiginna
.no-gutters
ka kɛ walasa.g-0
ka bɛn gutter utilities kura ma.
- A ye jibolisiraw kalasi kura (
-
Kolonw ma
position: relative
baara Kɛ tugun, o la, i bɛ Se ka dɔ Fàra.position-relative
fɛn dɔw kan walasa k’o kɛcogo Lasegin. -
Ka kariA ye kalan damadɔw bila
.order-*
minnu tun bɛ to ka taa baara tɛ kɛ ni minnu ye. An bɛ sisan dɔrɔn de di.order-1
ka.order-5
bɔ kɛsu kɔnɔ. -
Ka kariA ye
.media
component (yɔrɔ) Dòn i n'a fɔ a bɛ Se ka Lasegin nɔgɔya la ni utilités (nafamafɛnw) ye. aw ye #28265 ani flex utilities ɲɛ lajɛ misali la . -
Ka kari
bootstrap-grid.css
sisan a bɛ talibox-sizing: border-box
kɛ kulu dɔrɔn de la sanni ka diɲɛ kɛsu-taamacogo lasegin. O cogo la, an ka grid styles bɛ se ka baara kɛ yɔrɔ caman na k’a sɔrɔ u ma dankari kɛ. -
$enable-grid-classes
tɛ minɛnko kalanw bɔli bali tugun. Aw ye #29146 lajɛ. -
A ye
make-col
mixin kuraya ka kɛ default ye ka kɛɲɛ ni kuluw ye minnu hakɛ ma fɔ.
Kɔnɔkow, Reboot, a ɲɔgɔnnaw
-
RFS bɛ baara kɛ sisan ka kɛɲɛ ni a daminɛ ye. Kumakun minnu bɛ baara kɛ ni
font-size()
mixin ye, olu bɛna u yɛrɛ ladilanfont-size
ka kɛɲɛ ni jatebɔlan ye. O fɛɛrɛ in tùn ye opt-in ye ni v4 ye fɔlɔ. -
Ka kariA ye an ka jiralan sɛbɛnnibolow labɛn kokura walasa k’an ka
$display-*
fɛn caman sɛmɛntiyalenw bila u nɔ na ani ka$display-font-sizes
Sass karti dɔ bila u nɔ na. Fana a ye$display-*-weight
bεnkan kelen-kelenw Bɔ s kelen na$display-font-weight
ani s ladilanenfont-size
. -
.display-*
A ye barokun hakɛ kura fila fara a kan,.display-5
ani.display-6
. -
Jɛɲɔgɔnya bɛ 'jyɛn 'kɔnɔ (a tɛ Kɛ 'yɔrɔ la dɔrɔn), fo n'u ye 'yɔrɔ kɛrɛnkɛrɛnnenw ye.
-
Tabali minnu labɛnna kokura walasa k’u ka cogoyaw labɛn kokura ani k’u jɔ kokura ni CSS fɛn caman sɛgɛsɛgɛli ye walasa ka se ka u ka cogoyaw mara kosɛbɛ.
-
Ka kariTabali minnu bɛ sigi sen kan, olu tɛ cogoyaw ciyɛn ta tugun.
-
Ka kari
.thead-light
ani.thead-dark
u bɛ fili ka ɲɛsin.table-*
kalasi suguya caman ma minnu bɛ se ka baara kɛ ni tabali kɔnɔfɛnw bɛɛ ye (thead
,tbody
,tfoot
,tr
,th
anitd
). -
Ka kari
table-row-variant()
Mixin tɔgɔ bɛ Yɛlɛma ka Kɛtable-variant()
ani a bɛ Sɔn paramɛtɛrɛ 2 dɔrɔn ma:$color
(kulɛri tɔgɔ) ani$value
(kulɛri kode). Dankan kulɛri ni fɔcogo kulɛriw bɛ jate u yɛrɛma ka da tabali factor variables (tabali factor variables) kan. -
Tabali selilɛri padding variables tila ka kɛ
-y
ani-x
. -
Ka kariKalanso bilala
.pre-scrollable
. Aw ye #29135 lajɛ -
Ka kari
.text-*
nafamafɛnw tɛ hover ni focus states fara links kan tugun..link-*
dɛmɛbagaw ka kalanw bɛ se ka kɛ o nɔ na. Aw ye #29267 lajɛ -
Ka kariKalanso bilala
.text-justify
. Aw ye #29793 lajɛ -
Segin default horizontal
padding-left
on<ul>
ani<ol>
elements ka bɔ browser default40px
la ka taa2rem
. -
A farala a kan
$enable-smooth-scroll
, min bɛ tali kɛscroll-behavior: smooth
diɲɛ fan bɛɛ la—n’a ma fɔ baarakɛlaw ye minnu bɛ lamaga dɔgɔya ɲiniprefers-reduced-motion
kunnafonidilanw ɲinini fɛ. Aw ye #31877 lajɛ
RTL ye
- Horizontal direction specific variables, utilities, ani mixins bɛɛ tɔgɔ jiginna walasa ka baara kɛ ni logical properties ye i n’a fɔ minnu bɛ sɔrɔ flexbox layouts kɔnɔ—misali la ,
start
ani ani .end
left
right
Sɛbɛnw
-
Formulaire flottant kura farala a kan! An ye Floating labels misali lafasa ka se foroko yɔrɔw ma minnu bɛ dɛmɛ dafalen na. Aw ye sɛbɛn ɲɛ kura lajɛ min tɔgɔ ye ko Floating labels.
-
Ka kari Native ani custom form elements (fɔcogo nafamaw) jɛlenw. Jateblaw, arajow, sugandiliw, ani donnafɛn wɛrɛw minnu tun bɛ ni native ani custom classes ye v4 kɔnɔ, olu faralen don ɲɔgɔn kan. Sisan an ka foroko kɔnɔfɛnw bɛɛ bɛ Se ka Kɛ ladamu ye pewu, u fanba tɛ mago ɲɛ HTML ladamulen na.
.custom-check
ye sisan.form-check
..custom-check.custom-switch
ye sisan.form-check.form-switch
..custom-select
ye sisan.form-select
..custom-file
ani.form-file
u bilala laada cogoyaw nɔ na sanfɛ.form-control
..custom-range
ye sisan.form-range
.- Jiginna native
.form-control-file
ani.form-control-range
.
-
Ka kariA binna
.input-group-append
ani.input-group-prepend
. Aw bɛ se sisan ka butɔni dɔrɔn fara a kan ani.input-group-text
i n’a fɔ donnajɛkuluw ka denw tilennen. -
Missing border radius min bɛ yen kabini tuma jan donna kulu kan ni validation feedback bug ye, o laban bɛ Labɛn ni kalasi wɛrɛ farali
.has-validation
ye donna kuluw kan ni validation ye. -
Ka kari A ye foroko kɛrɛnkɛrɛnnenw labɛncogo kalanw bila an ka grid system (jatebɔlan) kama. Baara kɛ ni an ka grid ni utilités ye
.form-group
,.form-row
, walima.form-inline
. -
Ka kariForoko labeliw bɛ ɲini sisan
.form-label
. -
Ka kari
.form-text
no longer setsdisplay
, o b’a to i bɛ se ka dɛmɛ sɛbɛn inline walima block block kɛ i n’a fɔ i b’a fɛ cogo min na HTML yɔrɔ caman cili dɔrɔn fɛ. -
Validation icons tɛ baara kɛ tugun
<select>
s nimultiple
. -
Labɛnna kokura source Sass files jukɔrɔ
scss/forms/
, donna kulu cogoyaw fana sen bɛ o la.
A yɔrɔw
- Nafa kelenw
padding
ka ɲɛsin lasɔminiw, buruburuw, kartiw, fɛnw jiginni, lisi kuluw, modaliw, popoverw, ani baarakɛminɛnw ma walasa ka sinsin an ka$spacer
fɛn caman sɛgɛsɛgɛli kan. Aw ye #30564 lajɛ .
Akordeyɔn
- A ye accordéon yɔrɔ kura fara a kan .
Kɔlɔsiliw
-
s ka ladamu cogoyaw bɔra
<hr>
lasɔmini kelen-kelen bɛɛ kɔnɔ bawo u bɛ baara kɛ ni u ye kabancurrentColor
.
Badgew (Badges).
-
Ka kari
.badge-*
A ye kulɛri kalasi bɛɛ bila kɔfɛ nafalanw kama (misali la, baara kɛli kɛ.bg-primary
a nɔ na.badge-primary
). -
Ka kariDropped
.badge-pill
— baara kɛ ni.rounded-pill
utilité ye o nɔ na. -
Ka kariA bɔra hover ni focus styles for
<a>
ani<button>
elements. -
dɔ farala badge default padding kan ka bɔ
.25em
/.5em
la ka taa.35em
/.65em
la .
Buruburuw
-
buruburuw cogoya fɔlɔ nɔgɔyara ni
padding
,background-color
, aniborder-radius
. -
CSS ladamucogo kura farala a kan
--bs-breadcrumb-divider
walasa ka ladamu nɔgɔya k’a sɔrɔ a ma kɛ wajibi ye ka CSS lajɛ kokura.
Butɔnw
-
Ka kari Toggle buttons , ni checkboxes walima arajow ye, olu tɛ JavaScript wajibiya tugun ani markup kura bɛ u la. An tɛ fɛn dɔ wajibiya tugun min bɛ kɛ ka fɛnw siri, ka fara ,
.btn-check
k’a<input>
ɲɔgɔn kan ni kalan suguya o.btn
suguya ye<label>
. Aw ye #30650 lajɛ . O kama docs bɔra an ka Buttons ɲɛ kan ka taa Formulaire yɔrɔ kura la. -
Ka kari A filila
.btn-block
ka ɲɛsin utilités ma. Sanni i ka baara.btn-block
kɛ.btn
ni . Aw bɛ wuli ka taa kalanw la minnu bɛ jaabi di walasa ka se ka u yɛrɛ minɛ kosɛbɛ. Aw ye docs kalan walasa ka misali dɔw sɔrɔ..d-grid
.gap-*
-
Updated our
button-variant()
anibutton-outline-variant()
mixins ka dɛmɛ don paramɛtɛrɛ wɛrɛw la. -
Butɔnw kurayali walasa ka dɔ fara danfara kan hover ani active states kan.
-
Butɔn minnu ye baarakɛbaliw ye sisan , olu bɛ
pointer-events: none;
.
Karti
-
Ka kariA jiginna
.card-deck
ka ɲɛsin an ka grid ma. Aw bɛ aw ka kartiw siri kulu kalanw kɔnɔ ani ka bangebaga.row-cols-*
minɛn dɔ fara a kan walasa ka karti dekiw dilan kokura (nka ni aw bɛ se ka kunnafoni caman sɔrɔ jaabiw labɛncogo kan). -
Ka kariA binna
.card-columns
ka ɲɛsin Masonry ma. Aw ye #28922 lajɛ . -
Ka karia ye accordion
.card
basigilen bila a nɔ na ni Accordion yɔrɔ kura ye .
Karosel
-
A ye fɛn kura
.carousel-dark
dɔ fara a kan sɛbɛnni dibimanw, kunnafonidiw, ani taamasiyɛnw kama (a ka ɲi kosɛbɛ kɔkanna jɛlenw kama). -
chevron taamasiyɛnw bilala karɔsili kunkankow nɔ na ni SVG kura ye ka bɔ Bootstrap taamasiyɛnw na .
Butɔn da tugu
-
Ka kariA tɔgɔ jiginna
.close
ka.btn-close
kɛ tɔgɔ ye min tɛ caman ye. -
Butɔnw dadonni bɛ baara Kɛ sisan ni a
background-image
(SVG min bɛ Dòn a la) Kɛ a nɔ na×
HTML kɔnɔ, o bɛ sira Di mɔgɔw ma minnu bɛ Se ka Labɛn nɔgɔya la k’a sɔrɔ i ma maga i ka taamaʃyɛn na. -
A ye fɛn kura dɔ fara a kan
.btn-close-white
min bɛ baara kɛ nifilter: invert(1)
a ye walasa ka se ka danfara caman bɔ taamasiyɛnw na ka ɲɛsin dibi kɔkannakow ma.
Ka bin
- A ye scroll anchoring bɔ acordionw kama.
Dropdowns (Donkiliw).
-
A ye fɛn kura dɔw fara a kan
.dropdown-menu-dark
ani fɛn caman ɲɔgɔnna minnu bɛ tali kɛ dibi la. -
A ye fɛn kura dɔw fara a kan ka ɲɛsin
$dropdown-padding-x
. -
A ye dibi don dropdown divider la walasa ka danfara ɲɛ.
-
Ka kariKo minnu bɛ Kɛ 'sènfɛ-sɛbɛnni na olu bɛɛ bɛ Daminɛ sisan 'sènfɛ-sɛbɛnni-butɔni kan ka sɔrɔ ka bugun fo ka Se bangebaga-yɔrɔ ma.
-
Sisan, 'fɛn minnu bɛ Dòn 'kɔnɔ, olu bɛ ni 'fɛn dɔ ye
data-bs-popper="static"
min bɛ Se ka Kɛ ni 'yɔrɔ bɛ 'yɔrɔ la min bɛ 'yɔrɔ la anidata-bs-popper="none"
ni 'yɔrɔ bɛ navbar (navbar) kɔnɔ. O bɛ Fàra o kan an ka JavaScript fɛ ani k’an Dɛmɛ ka baara Kɛ ni jɔyɔrɔfalen-falen-cogow ye k’a sɔrɔ an ma Popper ka jɔyɔrɔfalen-falen-falen Kɛ. -
Ka kariA bɔra
flip
sugandili la ka ɲɛsin dropdown plugin ma min bɛ Popper native configuration nafa. Sisan i bɛ se ka flipping kɛcogo bali ni i ye array lankolon dɔ tɛmɛ forfallbackPlacements
option in flip modifier kɔnɔ. -
sisan menu minnu bɛ jigin , olu bɛ se ka digi ni
autoClose
sugandi kura ye walasa ka auto close kɛcogo ɲɛnabɔ . I bɛ se ka baara kɛ ni nin sugandi in ye walasa ka sɔn ka digi yɔrɔ la min bɛ yɔrɔ la walima a kɔkan walasa a ka kɛ fɛn ye min bɛ se ka kɛ ɲɔgɔn fɛ. -
Dropdowns sisan bɛ
.dropdown-item
s dɛmɛ min sirilen bɛ<li>
s la.
Jumbotron ye
- Ka kariA ye jumbotron yɔrɔ bila iko a bɛ se ka segin ni nafamafɛnw ye. Aw ye an ka Jumbotron misali kura lajɛ walasa ka demo sɔrɔ.
Lisiti kulu
- A ye fɛn kura Fàra
.list-group-numbered
ɲɔgɔn kan ka Kɛ kuluw lisɛli ye.
Navs ani tabs
null
A ye fɛn kura dɔw farafont-size
,font-weight
,color
, ani:hover
color
kan.nav-link
kalan na.
Navbarw ye
- Ka kariNavbarw bɛ minɛn dɔ de wajibiya sisan kɔnɔna na (walasa ka yɔrɔjan ɲininiw nɔgɔya kosɛbɛ ani CSS wajibiyalenw).
Offcanvas ye
- A ye offcanvas yɔrɔ kura fara a kan .
Ɲɛjirali sɛbɛnw
-
Pagenation links sisan bɛ customizable
margin-left
minnu bɛ dynamiquement rounded kan corner bɛɛ kan ni u faralen don ɲɔgɔn kan. -
A
transition
ye s fara ɲɛɲiniw kan.
Popovers (Popovers) ye
-
Ka kariA tɔgɔ jiginna
.arrow
ka.popover-arrow
kɛ an ka popover template default kɔnɔ. -
Tɔgɔ caman tigɛra
whiteList
sugandili la ka kɛallowList
.
Fɛnɲɛnɛmaw
-
Spinners bɛ bonya sisan
prefers-reduced-motion: reduce
ni animations (animasiyɔnw) sumaya ye. Aw ye #31882 lajɛ . -
A ka fisa ni spinner vertical alignment ye.
Tositiw bɛ kɛ
-
tositiw bɛ se ka bila sisan a kɔnɔ ni jɔyɔrɔfalen nafamafɛnw
.toast-container
dɛmɛ ye . -
Tositi kuntaala dafalen Changé ka kɛ segin 5 ye.
-
A bɛ bɔ tobilikɛminɛnw na ka a bila a nɔ na ni s
overflow: hidden
bɛnnenw ye ni baarakɛcogo ye.border-radius
calc()
Baarakɛminɛnw ladilikanw
-
Ka kariTɔgɔ
.arrow
kura.tooltip-arrow
donna an ka baarakɛminɛnw jatebɔsɛbɛn kɔnɔ. -
Ka kariNafa min bɛ sɔrɔ o la,
fallbackPlacements
o bɛ Changé ka['top', 'right', 'bottom', 'left']
kɛ walasa ka popper elements bila ka ɲɛ. -
Ka kariTɔgɔ caman tigɛra
whiteList
sugandili la ka kɛallowList
.
Nafamafɛnw
-
Ka kariA ye nafa caman tɔgɔ caman sɛmɛntiya walasa ka baara kɛ ni logical property tɔgɔw ye sira tɔgɔw nɔ na ni RTL dɛmɛ faralen ye a kan:
- Tɔgɔ kura donna
.left-*
ani.right-*
ka taa.start-*
ani.end-*
. - Tɔgɔ kura donna
.float-left
ani.float-right
ka taa.float-start
ani.float-end
. - Tɔgɔ kura donna
.border-left
ani.border-right
ka taa.border-start
ani.border-end
. - Tɔgɔ kura donna
.rounded-left
ani.rounded-right
ka taa.rounded-start
ani.rounded-end
. - Tɔgɔ kura donna
.ml-*
ani.mr-*
ka taa.ms-*
ani.me-*
. - Tɔgɔ kura donna
.pl-*
ani.pr-*
ka taa.ps-*
ani.pe-*
. - Tɔgɔ kura donna
.text-left
ani.text-right
ka taa.text-start
ani.text-end
.
- Tɔgɔ kura donna
-
Ka kariMarge négatifs (Marges négatifs) balilen don ka kɛɲɛ ni default ye.
-
Kalanso kura farala a kan walasa ka 's kɔkanna
.bg-body
sigi teliya la ka kɛ fɛn wɛrɛw ye.<body>
-
A ye jɔyɔrɔ nafamafɛn kura fara a kan
top
,right
,bottom
, anileft
. Nafaw bɛ0
,50%
, ani100%
nafolo kelen-kelen bɛɛ la. -
A ye kura
.translate-middle-x
&.translate-middle-y
nafamafɛnw fara a kan ka ɲɛsin horizontalement walima vertically center absolute/fixed positioned elements ma. -
border-width
Nafamafɛn kura dɔw farala a kan . -
Ka kariA tɔgɔ jiginna
.text-monospace
ka kɛ.font-monospace
. -
Ka kariA Bɔra
.text-hide
bari a ye fɛɛrɛ kɔrɔlen ye sɛbɛnni dogo la min man kan ka Kɛ tugun. -
Nafalanw farala
.fs-*
nafalanwfont-size
kan (ni RFS bɛ baara la). Olu bɛ baara Kɛ ni sɛgɛsɛgɛli kelen ye ni HTML ka dakun fɔlɔw ye (1-6, belebele ka Taa fitinin), wa u bɛ Se ka Lakodɔn Sass karti fɛ. -
Ka kariNafamafɛnw tɔgɔ caman tigɛra
.font-weight-*
i n’a fɔ.fw-*
a surunyali ni a bɛnkan. -
Ka kariNafamafɛnw tɔgɔ caman tigɛra
.font-style-*
i n’a fɔ.fst-*
a surunyali ni a bɛnkan. -
A farala a kan
.d-grid
walasa ka nafalanw jira ani nafalan kurawgap
(.gap
) CSS Grid ani flexbox layidu talenw kama. -
Ka kariA bɔra
.rounded-sm
anirounded-lg
, ka kalan hakɛ kura dɔ don a kɔnɔ,.rounded-0
ka.rounded-3
. Aw ye #31687 lajɛ . -
Nafamafɛn kura dɔw farala a kan
line-height
:.lh-1
,.lh-sm
,.lh-base
ani.lh-lg
. Aw ye a lajɛ yan . -
A ye
.d-none
nafalan in wuli an ka CSS kɔnɔ walasa ka girinya caman di a ma ka tɛmɛ jiralan nafamafɛn tɔw kan. -
A ye dɛmɛbaga janya
.visually-hidden-focusable
ka baara kɛ fana minɛnw kan, ka baara kɛ ni:focus-within
.
Dɛmɛbagaw
-
Ka kari Jaabi embed dɛmɛbagaw tɔgɔ jiginna ka kɛ ratio dɛmɛbagaw ye ni kala tɔgɔ kuraw ye ani kɛcogo ɲumanw, ka fara CSS fɛn caman sɛgɛsɛgɛli kan.
- Kalansow tɔgɔ jiginna ka Changé
by
kax
kɛ in aspect ratio ye. Misali la,.ratio-16by9
ye sisan.ratio-16x9
. - An ye
.embed-responsive-item
ani element kulu sugandili Blà ka ɲɛsin sugandili nɔgɔman dɔ.ratio > *
ma. Kalanso wɛrɛ mago tɛ yen, wa ratio dɛmɛbaga bɛ baara kɛ sisan ni HTML fɛn o fɛn ye. - Sass karti tɔgɔ
$embed-responsive-aspect-ratios
jiginna ka kɛ$aspect-ratios
a nafaw nɔgɔyara walasa ka kalasi tɔgɔ ni kɛmɛsarada la don a la i n’a fɔkey: value
fila. - CSS bεε bε bεn sisan ka bεn nafa kelen-kelen bɛɛ ma Sass karti kɔnɔ. fɛn
--bs-aspect-ratio
caman b' a la ka.ratio
fɛn caman sɛmɛntiya .
- Kalansow tɔgɔ jiginna ka Changé
-
Ka kari “Screen reader” kalanw ye sisan “yecogo dogolenw” kalanw ye .
- A ye Sass filen Changé ka bɔ
scss/helpers/_screenreaders.scss
ka taascss/helpers/_visually-hidden.scss
- Tɔgɔ kura donna
.sr-only
ani.sr-only-focusable
ka kɛ.visually-hidden
ani.visually-hidden-focusable
- Tɔgɔ kura donna
sr-only()
anisr-only-focusable()
mixins ka kɛvisually-hidden()
anivisually-hidden-focusable()
.
- A ye Sass filen Changé ka bɔ
-
bootstrap-utilities.css
sisan, an dɛmɛbagaw fana sen bɛ o la. Dɛmɛbagaw mago tɛ ka don ladamu jɔli la tugun.
JavaScript ye
-
A ye jQuery dependency bila ka plugins sɛbɛn kokura walasa u ka kɛ JavaScript basigilen kɔnɔ.
-
Ka kariJavaScript plugins bɛɛ ka data attributes (daɲɛw) bɛ tɔgɔladonni na sisan walasa ka dɛmɛ don ka Bootstrap baarakɛcogo faranfasi ka bɔ mɔgɔ wɛrɛw la ani i yɛrɛ ka kode la. Misali la, an bɛ baara kɛ
data-bs-toggle
nidata-toggle
. -
Sisan, plugins bɛɛ bɛ se ka sɔn CSS sugandili ma i n’a fɔ dalilu fɔlɔ. Aw bɛ se ka DOM yɔrɔ dɔ tɛmɛ walima CSS sugandilikɛlan ɲuman o fɛn bɛ se ka kɛ walasa ka plugin instance kura dɔ da:
var modal = new bootstrap.Modal('#myModal') var dropdown = new bootstrap.Dropdown('[data-bs-toggle="dropdown"]')
-
popperConfig
bɛ se ka tɛmɛ i n’a fɔ baarakɛcogo min bɛ sɔn Bootstrap ka Popper config default ma i n’a fɔ argument, walasa i ka se ka nin default configuration in fara ɲɔgɔn kan i ka sira kan. A bɛ tali kɛ dropdowns, popovers ani baarakɛminɛnw na. -
Nafa min bɛ sɔrɔ o la,
fallbackPlacements
o bɛ Changé ka['top', 'right', 'bottom', 'left']
kɛ walasa ka Popper elements bila ka ɲɛ. A bɛ tali kɛ dropdowns, popovers ani baarakɛminɛnw na. -
A bɔra forobaciyɛn jɔlenw na i n' a fɔ
_getInstance()
→getInstance()
.