Hla mus rau cov ntsiab lus tseem ceeb Hla mus rau docs navigation
Check
in English

Kev siv tau

Cov ntsiab lus luv luv ntawm Bootstrap cov yam ntxwv thiab cov kev txwv rau kev tsim cov ntsiab lus siv tau.

Bootstrap muab ib qho yooj yim-rau-siv lub moj khaum ntawm npaj txhij-ua qauv, layout cov cuab yeej, thiab sib tham sib Cheebtsam, tso cai rau cov neeg tsim khoom los tsim cov vev xaib thiab cov ntawv thov uas pom tau zoo, ua haujlwm nplua nuj, thiab nkag tau tawm ntawm lub thawv.

Txheej txheem cej luam thiab kev txwv

Tag nrho cov kev nkag mus tau yooj yim ntawm txhua qhov haujlwm tsim nrog Bootstrap nyob ntawm ntau qhov ntawm tus sau cov cim, ntxiv styling, thiab sau ntawv lawv tau suav nrog. Txawm li cas los xij, yog tias cov no tau raug coj los ua kom raug, nws yuav tsum muaj peev xwm ua tau zoo los tsim cov vev xaib thiab cov ntawv thov nrog Bootstrap uas ua tiav WCAG 2.1 (A / AA / AAA), Tshooj 508 , thiab cov qauv siv tau zoo sib xws thiab cov kev cai.

Cov qauv cim

Bootstrap's styling thiab layout tuaj yeem siv rau ntau hom kev kos duab. Cov ntaub ntawv no yog tsim los muab cov neeg tsim khoom nrog cov qauv kev coj ua zoo tshaj plaws los qhia txog kev siv Bootstrap nws tus kheej thiab qhia txog qhov tsim nyog cov cim kos npe, suav nrog txoj hauv kev uas muaj peev xwm cuam tshuam txog kev txhawj xeeb tuaj yeem daws tau.

Sib tham sib Cheebtsam

Bootstrap's interactive Cheebtsam - xws li modal dialogs, dropdown menus, thiab custom tooltips - yog tsim los ua hauj lwm rau kov, nas, thiab keyboard cov neeg siv. Los ntawm kev siv WAI - ARIA lub luag haujlwm thiab cov yam ntxwv, cov khoom no kuj tseem yuav nkag siab thiab ua haujlwm tau siv cov thev naus laus zis pab (xws li cov nyeem ntawv tshuaj ntsuam).

Vim tias Bootstrap cov khoom yog lub hom phiaj tsim los ua kom muaj txiaj ntsig zoo, cov kws sau ntawv yuav xav tau ntxiv ARIA lub luag haujlwm thiab cov cwj pwm, nrog rau JavaScript tus cwj pwm, kom paub meej qhov tseeb thiab kev ua haujlwm ntawm lawv cov khoom. Qhov no feem ntau yog sau rau hauv cov ntaub ntawv.

Xim sib txawv

Qee qhov kev sib txuas ntawm cov xim uas tam sim no ua rau Bootstrap lub palette default-siv thoob plaws hauv lub moj khaum rau tej yam xws li khawm variations, ceeb toom variations, daim ntawv validation indicators, As yuav ua rau tsis txaus xim sib piv (hauv qab cov lus pom zoo WCAG 2.1 ntawv xim sib piv piv ntawm 4.5:1 thiab WCAG 2.1 tsis yog cov ntawv xim sib piv ntawm 3: 1 ), tshwj xeeb tshaj yog thaum siv tawm tsam lub teeb tom qab. Cov kws sau ntawv raug txhawb kom sim lawv cov kev siv xim tshwj xeeb thiab, yog tias tsim nyog, hloov kho / txuas ntxiv cov xim no kom paub meej cov xim zoo sib xws.

Visually zais cov ntsiab lus

Cov ntsiab lus uas yuav tsum tau muab zais tsis pom kev, tab sis tseem nkag mus rau cov cuab yeej pabcuam xws li kev tshuaj ntsuam nyeem ntawv, tuaj yeem tsim qauv siv .visually-hiddenchav kawm. Qhov no tuaj yeem muaj txiaj ntsig zoo rau cov xwm txheej uas cov ntaub ntawv pom lossis cov lus qhia ntxiv (xws li lub ntsiab lus qhia los ntawm kev siv xim) yuav tsum tau xa mus rau cov neeg siv tsis pom kev.

<p class="text-danger">
  <span class="visually-hidden">Danger: </span>
  This action is not reversible
</p>

Rau qhov pom kev zais kev sib tham sib tswj, xws li cov kev sib txuas "skip" ib txwm, siv .visually-hidden-focusablechav kawm. Qhov no yuav xyuas kom meej tias kev tswj tau pom ib zaug tsom (rau cov neeg siv cov keyboard pom). Saib xyuas, piv rau qhov sib npaug .sr-onlythiab .sr-only-focusablecov chav kawm nyob rau yav dhau los versions, Bootstrap 5's .visually-hidden-focusableyog chav kawm nyob ib leeg, thiab yuav tsum tsis txhob siv ua ke nrog cov .visually-hiddenchav kawm.

<a class="visually-hidden-focusable" href="#content">Skip to main content</a>

Txo cov lus tsa suab

Bootstrap suav nrog kev txhawb nqa rau kev prefers-reduced-motiontshaj tawm feature . Hauv browsers / ib puag ncig uas tso cai rau tus neeg siv qhia lawv qhov kev nyiam rau kev txo qis, feem ntau CSS hloov pauv cuam tshuam hauv Bootstrap (piv txwv li, thaum lub rooj sib tham qhib lossis kaw, lossis zawv zawg animation hauv carousels) yuav ua tsis taus, thiab muaj txiaj ntsig animations ( xws li spinners) yuav qeeb.

Ntawm cov browsers uas txhawb nqa prefers-reduced-motion, thiab qhov twg tus neeg siv tsis tau qhia meej meej tias lawv xav kom txo cov lus tsa suab (piv txwv li qhov twg prefers-reduced-motion: no-preference), Bootstrap enables smooth scrolling siv cov scroll-behaviorcuab yeej.

Cov peev txheej ntxiv