Fa'asolo ile v5
Su'esu'e ma toe iloilo suiga i faila fa'apogai a Bootstrap, fa'amaumauga, ma vaega e fesoasoani ia te oe e femalaga'i mai le v4 i le v5.
Fa'alagolago
- Pa'u le jQuery.
- Fa'aleleia mai Popper v1.x i Popper v2.x.
- Suia le Libsass ma Dart Sass ona o le matou Sass compiler na tuʻuina atu ia Libsass ua faʻaumatia.
- Na siitia mai Jekyll i Hugo mo le fausiaina oa matou pepa
Lagolago su'esu'e
- Tu'u le Internet Explorer 10 ma le 11
- Pa'u Microsoft Edge <16 (Legacy Edge)
- Pa'u Firefox <60
- Pa'u Safari <12
- Pa'u iOS Safari <12
- Pa'u Chrome <60
Suiga fa'amaumauga
- Toe fa'atulagaina itulau autu, fa'atulagaina o pepa, ma vae.
- Fa'aopoopo le ta'iala fou o Parcel .
- Fa'aopoopoina le vaega fou Fa'asinomaga , sui le v4's Theming page , fa'atasi ai ma fa'amatalaga fou i luga o Sass, filifiliga fa'atulagaina o le lalolagi, lanu lanu, fesuiaiga CSS, ma isi mea.
- Toe fa'atulagaina uma pepa fa'amaumauga i le vaega fou o Fomu , vaevae le anotusi i itulau e sili atu ona taula'i.
- E fa'apena fo'i, fa'afou le vaega Layout , e fa'amanino atili ai le fa'asologa o mea.
- Toe fa'aigoa "Navs" itulau vaega i le "Navs & Tabs".
- Toe fa'aigoa "Siaki" itulau i le "Siaki & leitio".
- Toe fa'atulaga le navbar ma fa'aopoopo i ai se subnav fou e fa'afaigofie ai le fe'avea'i o matou saite ma fa'amatalaga o fa'amaumauga.
- Fa'aopoopoina le ala pupuu fou mo le fanua su'esu'e: Ctrl + /.
Sass
-
Ua matou lafoa'ia le fa'aogaina o fa'afanua Sass fa'apipi'i ina ia fa'afaigofie ona aveese fa'atauga fa'aletonu. Ia manatua e tatau nei ona e faʻamalamalamaina tulaga taua uma i faʻafanua Sass pei o
$theme-colors
. Siaki pe fa'afefea ona fai fa'afanua Sass . -
gauToe fa'aigoa
color-yiq()
galuega ma fa'afeso'ota'i fa'afeso'ota'icolor-contrast()
ona ua le toe feso'ota'i ile YIQ colorspace. Va'ai #30168.$yiq-contrasted-threshold
ua toe faaigoa ia$min-contrast-ratio
.$yiq-text-dark
ma$yiq-text-light
ua toe faaigoa i le$color-contrast-dark
ma$color-contrast-light
.
-
gauFa'asalalauga fesili fa'afefiloi fa'amaufa'ailoga ua suia mo se faiga fa'atatau.
media-breakpoint-down()
fa'aaoga le va'aiga lava ia nai lo le isi va'aiga (fa'ata'ita'iga,media-breakpoint-down(lg)
nai lo lemedia-breakpoint-down(md)
va'aiga taula'i la'ititi nai lolg
).- E fa'apena fo'i, o le parakalafa lona lua i totonu
media-breakpoint-between()
o lo'o fa'aogaina ai le va'aiga lava ia nai lo le isi va'aiga (fa'ata'ita'iga,media-between(sm, lg)
nai lo lemedia-breakpoint-between(sm, md)
va'aiga va'ai i le vasm
ma lelg
).
-
gauAve'ese sitaili lolomi ma
$enable-print-styles
fesuia'i. O lo'o iai pea vasega fa'aali lolomi. Va'ai #28339 . -
gauPa'u
color()
,theme-color()
, magray()
galuega e fiafia i fesuiaiga. Va'ai #29083 . -
gauToe fa'aigoa
theme-color-level()
galuegacolor-level()
ma talia nei so'o se lanu e te mana'o ai nai lo na'o$theme-color
lanu. Va'ai #29083 Va'ai mai:color-level()
na tu'u mulimuli ane i totonuv5.0.0-alpha3
. -
gauToe fa'aigoa
$enable-prefers-reduced-motion-media-query
ma$enable-pointer-cursor-for-buttons
i$enable-reduced-motion
ma$enable-button-pointers
fa'apuupuu. -
gauAveese le
bg-gradient-variant()
mixin. Fa'aoga le.bg-gradient
vasega e fa'aopoopo ai fa'alili i elemene nai lo.bg-gradient-*
vasega fa'atupu. -
gau Ave'ese fa'afefiloi ua le toe fa'aaogaina:
hover
,hover-focus
,plain-hover-focus
, mahover-focus-active
float()
form-control-mixin()
nav-divider()
retina-img()
text-hide()
(na faʻaumatia foʻi le vasega aoga faʻapitoa,.text-hide
)visibility()
form-control-focus()
-
gauToe fa'aigoa
scale-color()
galuega inashift-color()
ia 'alofia le fete'ena'i ma le galuega a Sass lava ia e fa'afua ai lanu. -
box-shadow
mixins ua fa'atagaina neinull
tulaga taua ma pa'unone
mai le tele o finauga. Va'ai #30394 . -
O le
border-radius()
mixin ua i ai nei se tau faaletonu.
Faiga lanu
-
Le faiga lanu sa galulue faatasi
color-level()
ma$theme-color-interval
na aveesea mo se faiga lanu fou. O mea umalighten()
madarken()
galuega i totonu o la tatou codebase ua suia i letint-color()
mashade-color()
. O nei gaioiga o le a faʻafefiloi le lanu ma le paʻepaʻe poʻo le uliuli nai lo le suia o lona mama i se aofaiga tumau. Oshift-color()
le a fa'alili pe paolo se lanu e fa'atatau i lona fua mamafa e lelei pe leaga. Va'ai #30622 mo nisi fa'amatalaga. -
Fa'aopoopo lanu fou ma paolo mo lanu uma, e maua ai lanu eseese e iva mo lanu fa'avae ta'itasi, e pei o suiga fou Sass.
-
Fa'aleleia le eseesega o lanu. Fa'afefeteina le fa'atusatusaga o lanu mai le 3:1 i le 4.5:1 ma fa'afou lanu lanumoana, lanumeamata, cyan, ma lanu piniki e fa'amautinoa ai le eseesega o le WCAG 2.1 AA. Na suia fo'i le matou lanu fa'atusatusa lanu mai
$gray-900
i le$black
. -
Ina ia lagolagoina la matou faiga lanu, ua matou faʻaopoopoina tu
tint-color()
ma aga foushade-color()
e faʻafefiloi lelei a matou lanu.
Fa'afou fa'asologa
-
New breakpoint! Fa'aopoopo le
xxl
va'aiga fou mo1400px
ma luga. Leai se suiga i isi nofoaga malolo uma. -
Fa'aleleia alavai. Ua seti nei alavai i rem, ma e vaapiapi nai lo le v4 (
1.5rem
, pe tusa o le24px
, lalo mai30px
). Ole mea lea e fa'aogatasi ai alavai ole faiga fa'ata'oto ma a tatou mea fa'aoga avanoa.- Fa'aopoopo le vasega alavai fou (
.g-*
,.gx-*
, ma.gy-*
) e pulea ai alavai faalava/tutusa, alavai faalava, ma alavai sa'o. - gauToe fa'aigoa
.no-gutters
e.g-0
fa'afetaui mea fa'aoga fou.
- Fa'aopoopo le vasega alavai fou (
-
Ua le toe
position: relative
fa'aogaina koluma, atonu e te fa'aopoopo.position-relative
i nisi elemene e toe fa'afo'i ai lena amio. -
gauFa'amuta nisi o
.order-*
vasega e masani ona le fa'aaogaina. Ua na'o matou tu'uina atu.order-1
i.order-5
fafo o le pusa. -
gauFa'ato'a le
.media
vaega ona e faigofie ona toe fa'atusa ma mea fa'aoga. Va'ai #28265 ma le itulau flex utilities mo se fa'ata'ita'iga . -
gau
bootstrap-grid.css
ua na'o le fa'aogabox-sizing: border-box
i le koluma nai lo le toe setiina o le pusa-fa'alelalolagi. O le auala lea, e mafai ona fa'aogaina a tatou sitaili fa'asologa i le tele o nofoaga e aunoa ma le fa'alavelave. -
$enable-grid-classes
e le toe fa'agataina le fa'atupuina o vasega pusa. Va'ai #29146. -
Fa'afou le
make-col
mixin e fa'aletonu i koluma tutusa e aunoa ma se lapo'a fa'apitoa.
Anotusi, Toe Toe, ma isi
-
Ua mafai nei le RFS ona o le faaletonu. O ulutala e fa'aaoga ai le
font-size()
mixin o le a otometi lava ona fetu'una'ifont-size
i le fua ma le va'aiga. O lenei vaega na muamua filifili i totonu ma v4. -
gauToe fa'alelei a matou fa'aaliga lomitusi e sui ai a matou
$display-*
fesuiaiga ma se$display-font-sizes
fa'afanua Sass. Aveese fo'i$display-*-weight
suiga ta'itasi mo se tasi$display-font-weight
ma fetu'una'ifont-size
s. -
Faaopoopo i ai
.display-*
ulutala fou e lua,.display-5
ma.display-6
. -
O so'oga o lo'o vaseina e ala i le fa'aletonu (e le na'o le fa'afefe), se'i vagana o se vaega o vaega fa'apitoa.
-
Toe fa'avasegaina laulau e fa'afou ai a latou sitaili ma toe fausia i latou CSS fesuiaiga mo le sili atu le pulea o sitaili.
-
gauO laulau fa'aputu e le toe fa'atosinaina sitaili.
-
gau
.thead-light
ma.thead-dark
ua pa'u i lalo i.table-*
vasega eseese e mafai ona fa'aoga mo elemene laulau uma (thead
,tbody
,tfoot
,tr
,th
matd
). -
gauO le
table-row-variant()
mixin ua toe fa'aigoainatable-variant()
ma talia na'o le 2 ta'iala:$color
(igoa lanu) ma le$value
(lanu lanu). O le lanu tuaoi ma lanu fa'ailo e otometi lava ona fa'atatau ile fua ole laulau. -
Vaevae le laulau fa'apipi'i fuala'au i totonu
-y
ma-x
. -
gauPa'u
.pre-scrollable
vasega. Va'ai #29135 -
gau
.text-*
e le'o toe fa'aopoopoina e fa'aoga le fa'apepe ma le fa'atatau i so'oga..link-*
e mafai ona fa'aoga vasega fesoasoani. Va'ai #29267 -
gauPa'u
.text-justify
vasega. Va'ai #29793 -
Toe seti fa'alava fa'alava i
padding-left
luga<ul>
ma<ol>
elemene mai le browser default40px
i le2rem
. -
Fa'aopoopo
$enable-smooth-scroll
, lea e fa'aogascroll-behavior: smooth
i le lalolagi atoa-sei vagana ai tagata fa'aoga o lo'o talosaga mo se fa'aitiitiga lafo e ala iprefers-reduced-motion
fa'amatalaga fa'asalalau. Va'ai #31877
RTL
- Fa'asagaga fa'asaga i suiga fa'apitoa, mea fa'aoga, ma fa'afefiloi ua toe fa'aigoaina uma e fa'aoga ai mea fa'atatau e pei o mea o lo'o maua i fa'ata'otoga flexbox—fa'ata'ita'iga,
start
maend
sui oleleft
maright
.
Fomu
-
Fa'aopoopo fomu fa'afefete fou! Ua matou fa'alauiloa le fa'ata'ita'iga Fa'ailoga Floating e lagolago atoatoa vaega fo'i. Va'ai le itulau fou o igoa Fa'alele.
-
gau Tu'ufa'atasi elemene fa'ale-aganu'u ma tu'ufa'atasiga. Pusa siaki, leitio, filifili, ma isi mea sa i ai vasega fa'ale-aganu'u ma aganu'u ile v4 ua tu'ufa'atasia. Ole taimi nei e toetoe lava o a tatou elemene foliga uma e masani lava, o le tele e aunoa ma le manaʻomia mo HTML masani.
.custom-check
ua.form-check
..custom-check.custom-switch
ua.form-check.form-switch
..custom-select
ua.form-select
..custom-file
ma.form-file
ua suia i sitaili masani i luga o.form-control
..custom-range
ua.form-range
.- Pa'u le nu'u
.form-control-file
ma.form-control-range
.
-
gauPa'u
.input-group-append
ma.input-group-prepend
. E mafai nei ona e fa'aopoopo fa'amau ma fa'atama'i.input-group-text
sa'o o vaega fa'aoga. -
Ole laina ole tuaoi ole umi ole va'ava'ai ile vaega o lo'o iai fa'atasi ma fa'amatalaga fa'amatalaga fa'amaonia ua mae'a fa'amautuina e ala ile fa'aopoopoina o se
.has-validation
vasega fa'aopoopo ile vaega fa'aofi fa'atasi ma le fa'amaoniga. -
gau Tu'u ese vasega fa'atulagaina fa'apitoa mo la matou faiga fa'ata. Fa'aoga la matou fa'asologa ma mea aoga nai lo le
.form-group
,.form-row
, po'o le.form-inline
. -
gauE mana'omia nei fa'ailoga pepa
.form-label
. -
gau
.form-text
le toe setiinadisplay
, e mafai ai ona e fatuina i totonu poʻo poloka fesoasoani tusitusiga e pei ona e manaʻo ai e ala i le suia o le elemene HTML. -
Ua le toe fa'aogaina ata fa'amaonia i
<select>
s mamultiple
. -
Toe fa'atulagaina faila Sass puna i lalo o
scss/forms/
le , e aofia ai sitaili vaega fa'aoga.
Vaega
- Tu'ufa'atasiga
padding
fa'atatau mo fa'aliga, fala falaoa, kata, pa'u i lalo, vaega lisi, mods, popovers, ma meafaigaluega e fa'atatau i la tatou$spacer
fesuiaiga. Va'ai #30564 .
Accordion
- Fa'aopoopo le vaega fou o le akordion .
Fa'aliga
-
O lo'o iai nei fa'ata'ita'iga ma fa'ailoga .
-
Aveese sitaili masani mo
<hr>
s i mataala ta'itasi talu ai ua latou fa'aogainacurrentColor
.
Faailoga
-
gauTu'u uma
.badge-*
vasega lanu mo mea aoga i tua (fa'ata'ita'iga, fa'aoga.bg-primary
nai lo le.badge-primary
). -
gauPa'u —
.badge-pill
faaaoga le.rounded-pill
aoga nai lo lena. -
gauAve'ese sitaili fa'ae'e ma taula'i
<a>
ma<button>
elemene. -
Fa'ateleina le fa'aogaina o fa'ailoga mo pine mai
.25em
/.5em
i.35em
/.65em
.
O falaoamata
-
Fa'afaigofie le fa'aaliaina o pa'u falaoa e ala i le aveeseina o le
padding
,background-color
, ma leborder-radius
. -
Fa'aopoopo mea totino aganu'u CSS fou
--bs-breadcrumb-divider
mo le fa'avasegaina faigofie e aunoa ma le mana'omia e toe fa'aopoopo CSS.
Fa'amau
-
gau Kiki ki , ma pusa siaki po'o leitio, e le toe mana'omia le JavaScript ma maua se fa'ailoga fou. Matou te le toe manaʻomia se elemene afifi, faʻaopoopo
.btn-check
i le<input>
, ma faʻapipiʻi ma soʻo se.btn
vasega i luga o le<label>
. Va'ai #30650 . O fa'amaumauga mo lea mea ua si'i mai le matou itulau Fa'amau i le vaega fou o Pepa. -
gau Pa'u
.btn-block
mo mea aoga. Nai lo le fa'aogaina.btn-block
i luga o le.btn
, afifi au faamau.d-grid
ma se.gap-*
aoga e fa'atalatala pe a mana'omia. Su'e i vasega tali atu mo le sili atu ona pulea i latou. Faitau le docs mo nisi faʻataʻitaʻiga. -
Fa'afouina a matou
button-variant()
mabutton-outline-variant()
mixins e lagolago ai fa'aputuga fa'aopoopo. -
Fa'afou fa'amau e fa'amautinoa ai le fa'aopoopoina o le fa'atusatusaga i le fa'afefete ma fa'agaoioi setete.
-
O fa'amau fa'aletonu ua iai nei
pointer-events: none;
.
Kata
-
gauPa'u
.card-deck
i le fiafia i la matou fa'asologa. Afifi au kata i vasega koluma ma fa'aopopo se.row-cols-*
atigipusa matua e toe fai ai fa'ato'aga kata (ae sili atu le fa'atonuina o le fa'aogaina o le tali). -
gauPa'u
.card-columns
i le lagolagoina o Masonry. Va'ai #28922 . -
gauSuia le
.card
accordion faavae i se vaega fou Accordion .
Carousel
-
Fa'aopoopoina le
.carousel-dark
suiga fou mo tusitusiga pogisa, fa'atonuga, ma fa'ailoga (sili mo ata mama). -
Suia chevron icons mo carousel controls i SVG fou mai Bootstrap Icons .
Tapuni faamau
-
gauToe fa'aigoaina
.close
mo.btn-close
se igoa fa'aitiiti. -
Fa'aaoga nei fa'amau tapuni se
background-image
(SVG fa'apipi'i) nai lo le×
i le HTML, fa'ataga mo le fa'avasegaina faigofie e aunoa ma le mana'omia e pa'i i lau fa'ailoga. -
Fa'aopoopo le
.btn-close-white
suiga fou e fa'aogafilter: invert(1)
e mafai ai ona fa'ate'a ese aikona fa'atusa maualuga atu i tua pogisa.
Pa'u
- Ave'ese le taula ta'ai mo accordions.
Pa'u i lalo
-
Fa'aopoopo suiga fou
.dropdown-menu-dark
ma fa'afeso'ota'i fesuiaiga mo fa'ato'aga pogisa i lalo. -
Faaopoopo suiga fou mo
$dropdown-padding-x
. -
Fa'apogisa le vase pa'u i lalo mo le fa'aleleia atili o le fa'atusatusaga.
-
gauO mea uma na tutupu mo le pa'u i lalo o lo'o fa'aosoina i luga o le pa'u toggle ki ma fa'aoso i luga i le elemene matua.
-
O lo'o i ai nei se
data-bs-popper="static"
uiga fa'atulagaina o menus dropdowndata-bs-popper="none"
pe a fa'amautu le fa'atulagaina o le pa'u i lalo ma pe a tu'u i lalo i le navbar. E fa'aopoopoina e le matou JavaScript ma fesoasoani ia i matou e fa'aoga sitaili tulaga masani e aunoa ma le fa'alavelave i le tulaga o Popper. -
gauPa'u
flip
le filifiliga mo le pa'u i lalo fa'apipi'i e fiafia i le fa'atulagaina o Popper. E mafai nei ona e fa'amalo le amio fe'avea'i e ala i le tu'uina atu o se laina gaogao mo lefallbackPlacements
filifiliga i le suiga fa'alili. -
E mafai nei ona kiliki i lalo menus ma se
autoClose
filifiliga fou e taulima ai le amio tapunia taʻavale . E mafai ona e fa'aogaina le filifiliga lea e talia ai le kiliki i totonu po'o fafo atu o le lisi pa'ū e fa'afeso'ota'i. -
Fa'ato'alalo ua lagolagoina
.dropdown-item
s afifi i<li>
s.
Jumbotron
- gauPa'u le vaega jumbotron ona e mafai ona toe faia i mea aoga. Va'ai la matou fa'ata'ita'iga fou Jumbotron mo se fa'ata'ita'iga.
Lisi vaega
- Fa'aopoopo se
.list-group-numbered
suiga fou i le lisi o vaega.
Navs ma tabs
- Fa'aopoopo
null
suiga fou mofont-size
,font-weight
,color
, ma:hover
color
le.nav-link
vasega.
Navbars
- gauUa mana'omia e Navbars se atigipusa i totonu (e fa'afaigofie tele le fa'aogaina o avanoa ma mana'omia le CSS).
Fa'alavalava
- Fa'aopoopo le vaega fou o le tapoleni .
Itulautusi
-
O feso'ota'iga fa'akomepiuta ua i ai nei e mafai ona fa'avasegaina
margin-left
e fa'ata'amilomilo malosi i tulimanu uma pe a vavae'ese mai le tasi ma le isi. -
Fa'aopoopo
transition
s i fa'aso'oga o itulau.
Popovers
-
gauToe fa'aigoa
.arrow
i.popover-arrow
la matou fa'ata'ita'iga fa'apipi'i fa'aletonu. -
Toe sui igoa
whiteList
i leallowList
.
Tagata milo
-
Ua fa'aaloalo nei Spinners
prefers-reduced-motion: reduce
e ala i le fa'agesegese o fa'afiafiaga. Va'ai #31882 . -
Fa'alelei le fa'aoga tu'usa'o o le spinner.
Toasts
-
Toasts e mafai nei ona tu'u i totonu o se
.toast-container
fa'atasi ai ma le fesoasoani a le fa'atulagaina o mea aoga . -
Suia le umi o le toast i le 5 sekone.
-
Ave'ese
overflow: hidden
mai toasts ma suia iborder-radius
s talafeagai macalc()
galuega tauave.
Mea faigaluega
-
gauToe fa'aigoa
.arrow
ile.tooltip-arrow
matou fa'ata'ita'iga fa'aoga meafaigaluega. -
gauO le tau fa'aletonu mo le
fallbackPlacements
ua suia i['top', 'right', 'bottom', 'left']
mo le fa'aogaina lelei o elemene popper. -
gauToe sui igoa
whiteList
i leallowList
.
Utilities
-
gauToe fa'aigoaina le tele o mea aoga e fa'aoga ai igoa o meatotino fa'atatau nai lo igoa fa'atonu ma le fa'aopoopoina o le lagolago a le RTL:
- Toe faaigoa
.left-*
ma.right-*
ia.start-*
ma.end-*
. - Toe faaigoa
.float-left
ma.float-right
ia.float-start
ma.float-end
. - Toe faaigoa
.border-left
ma.border-right
ia.border-start
ma.border-end
. - Toe faaigoa
.rounded-left
ma.rounded-right
ia.rounded-start
ma.rounded-end
. - Toe faaigoa
.ml-*
ma.mr-*
ia.ms-*
ma.me-*
. - Toe faaigoa
.pl-*
ma.pr-*
ia.ps-*
ma.pe-*
. - Toe faaigoa
.text-left
ma.text-right
ia.text-start
ma.text-end
.
- Toe faaigoa
-
gauFa'aleaogaina le fa'atagata le lelei ona o le fa'aletonu.
-
Fa'aopoopo le
.bg-body
vasega fou mo le fa'atulagaina vave o le<body>
's background i elemene fa'aopoopo. -
Fa'aopoopo tulaga fa'aoga fou mo
top
,right
,bottom
, maleft
. O tau e aofia ai0
,50%
, ma100%
mo meatotino taitasi. -
Fa'aopoopo mea fou
.translate-middle-x
&.translate-middle-y
fa'aoga ile fa'alava po'o le tu'u sa'o totonugalemu elemene tu'usa'o. -
Fa'aopoopo
border-width
mea faigaluega fou . -
gauToe sui igoa
.text-monospace
ia.font-monospace
. -
gauAve'esea
.text-hide
ona ose auala tuai mo le nanaina o tusitusiga e le tatau ona toe fa'aogaina. -
Fa'aopoopo
.fs-*
mea fa'aoga mofont-size
mea aoga (fa'atasi ai ma le RFS ua mafai). O lo'o fa'aogaina e nei mea le fua tutusa ma ulutala fa'aletonu a le HTML (1-6, lapopo'a i le la'ititi), ma e mafai ona suia e ala i le fa'afanua Sass. -
gauToe fa'aigoa
.font-weight-*
fa'aoga.fw-*
mo le fa'apuupuu ma le fa'atumauina. -
gauToe fa'aigoa
.font-style-*
fa'aoga.fst-*
mo le fa'apuupuu ma le fa'atumauina. -
Fa'aopoopo
.d-grid
e fa'aalia ai mea aoga magap
mea fa'aoga fou (.gap
) mo CSS Grid ma flexbox layouts. -
gauAve'esea
.rounded-sm
marounded-lg
, ma fa'alauiloa mai se fua fou o vasega,.rounded-0
i le.rounded-3
. Va'ai #31687 . -
Fa'aopoopo
line-height
mea aoga fou:.lh-1
,.lh-sm
,.lh-base
ma.lh-lg
. Va'ai iinei . -
Si'itia le
.d-none
aoga i totonu o la tatou CSS e fa'asili atu ai le mamafa nai lo isi fa'aoga fa'aaliga. -
Fa'alautele le
.visually-hidden-focusable
fesoasoani e galue fo'i i koneteina, fa'aaoga:focus-within
.
Fesoasoani
-
gau O fesoasoani fa'apipi'i tali ua toe fa'aigoaina e fa'atatau i fesoasoani fa'atasi ma igoa fou o vasega ma fa'aleleia amioga, fa'apea fo'i ma se suiga fesoasoani CSS.
- Ua toe fa'aigoa vasega ina ia suia
by
ix
le fa'atusa. Mo se faataitaiga,.ratio-16by9
o le taimi nei.ratio-16x9
. - Ua matou fa'ate'aina le
.embed-responsive-item
ma le elemene vaega filifilia e fa'atatau i se filifiliga faigofie.ratio > *
. Leai se isi vasega e manaʻomia, ma o loʻo galue nei le fesoasoani faʻatusatusa i soʻo se elemene HTML. - O le
$embed-responsive-aspect-ratios
fa'afanua Sass ua toe fa'aigoaina$aspect-ratios
ma ua fa'afaigofie ona fa'atatau e aofia ai le igoa o le vasega ma le pasene o lekey: value
paga. - CSS fesuia'i ua fa'atupuina ma fa'aaofia mo tau ta'itasi ile fa'afanua Sass. Suia le
--bs-aspect-ratio
fesuiaiga i luga o le.ratio
e fatu ai soʻo se fua faʻatatau masani .
- Ua toe fa'aigoa vasega ina ia suia
-
gau O vasega o le “Screen reader” ua avea nei ma vasega “natia vaaia” .
- Suia le faila Sass mai
scss/helpers/_screenreaders.scss
lescss/helpers/_visually-hidden.scss
- Toe faaigoa
.sr-only
ma.sr-only-focusable
ia.visually-hidden
ma.visually-hidden-focusable
- Toe fa'aigoa
sr-only()
masr-only-focusable()
fa'afefiloi ivisually-hidden()
mavisually-hidden-focusable()
.
- Suia le faila Sass mai
-
bootstrap-utilities.css
o lea ua aofia ai foi ma o tatou fesoasoani. E le toe mana'omia le fa'aulufale mai o fesoasoani ile fale fa'aleaganu'u.
Javascript
-
Fa'aitiitia le fa'alagolago i le jQuery ma toe tusi fa'apipi'i e fai i le JavaScript masani.
-
gauO fa'amaumauga o fa'amaumauga mo plugini JavaScript uma ua fa'aigoaina nei e fesoasoani e iloa ai le fa'aogaina o Bootstrap mai isi vaega ma lau lava code. Mo se faataitaiga, matou te faaaogaina
data-bs-toggle
nai lo ledata-toggle
. -
O plugini uma e mafai nei ona talia se CSS filifilia e fai ma finauga muamua. E mafai ona e pasia se elemene DOM poʻo soʻo se tagata filifilia CSS aoga e fatu ai se faʻataʻitaʻiga fou o le plugin:
var modal = new bootstrap.Modal('#myModal') var dropdown = new bootstrap.Dropdown('[data-bs-toggle="dropdown"]')
-
popperConfig
e mafai ona pasia e avea o se galuega e talia le Bootstrap's default Popper config e fai ma finauga, ina ia mafai ona e tuʻufaʻatasia lenei faʻaoga le lelei i lau ala. Fa'aoga i fa'alalo, popovers, ma meafaigaluega. -
O le tau fa'aletonu mo le
fallbackPlacements
ua suia i['top', 'right', 'bottom', 'left']
mo le tu'uina lelei o elemene Popper. Fa'aoga i fa'alalo, popovers, ma meafaigaluega. -
Ave'esea fa'amaufa'ailoga mai auala fa'apitoa fa'alaua'itele pei
_getInstance()
ole →getInstance()
.