Source

Osakatula ndi zida

Phunzirani za asakatuli ndi zida, kuyambira zamakono mpaka zakale, zomwe zimathandizidwa ndi Bootstrap, kuphatikiza zodziwika bwino ndi nsikidzi pa chilichonse.

Asakatuli othandizidwa

Bootstrap imathandizira kutulutsa kwaposachedwa, kokhazikika kwa asakatuli onse akuluakulu ndi nsanja. Pa Windows, timathandizira Internet Explorer 10-11 / Microsoft Edge .

Asakatuli ena omwe amagwiritsa ntchito mtundu waposachedwa kwambiri wa WebKit, Blink, kapena Gecko, kaya mwachindunji kapena kudzera pawebusayiti ya API, samathandizidwa. Komabe, Bootstrap iyenera (nthawi zambiri) kuwonetsa ndikugwira ntchito moyenera msakatuliwanso. Zambiri zothandizira zikuperekedwa pansipa.

Zida zam'manja

Nthawi zambiri, Bootstrap imathandizira mitundu yaposachedwa ya asakatuli amtundu uliwonse. Dziwani kuti asakatuli a proxy (monga Opera Mini, Opera Mobile's Turbo mode, UC Browser Mini, Amazon Silk) sagwiritsidwa ntchito.

Chrome Firefox Safari Android Browser & WebView Microsoft Edge
Android Zothandizidwa Zothandizidwa N / A Android v5.0+ imathandizidwa Zothandizidwa
iOS Zothandizidwa Zothandizidwa Zothandizidwa N / A Zothandizidwa
Windows 10 Mobile N / A N / A N / A N / A Zothandizidwa

Asakatuli apakompyuta

Mofananamo, mitundu yaposachedwa ya asakatuli ambiri apakompyuta imathandizidwa.

Chrome Firefox Internet Explorer Microsoft Edge Opera Safari
Mac Zothandizidwa Zothandizidwa N / A N / A Zothandizidwa Zothandizidwa
Mawindo Zothandizidwa Zothandizidwa Imathandizidwa, IE10+ Zothandizidwa Zothandizidwa Osathandizidwa

Kwa Firefox, kuwonjezera pa kumasulidwa kokhazikika kwaposachedwa, timathandiziranso mtundu waposachedwa wa Extended Support Release (ESR) wa Firefox.

Mosavomerezeka, Bootstrap iyenera kuyang'ana ndikuchita bwino mu Chromium ndi Chrome ya Linux, Firefox ya Linux, ndi Internet Explorer 9, ngakhale sizimathandizidwa.

Kuti mupeze mndandanda wazovuta zina za msakatuli zomwe Bootstrap ikuyenera kulimbana nazo, onani Wall of browser bugs .

Internet Explorer

Internet Explorer 10+ imathandizidwa; IE9 ndi pansi si. Chonde dziwani kuti zinthu zina za CSS3 ndi HTML5 sizimagwiritsidwa ntchito mokwanira mu IE10, kapena zimafuna ma prefix kuti zigwire ntchito zonse. Pitani Kodi ndingagwiritse ntchito… kuti mumve zambiri za chithandizo cha msakatuli cha CSS3 ndi mawonekedwe a HTML5.

Ngati mukufuna thandizo la IE8-9, gwiritsani ntchito Bootstrap 3. Ndilo mtundu wokhazikika wa code yathu ndipo imathandizidwabe ndi gulu lathu pakukonza zolakwika ndikusintha zolemba. Komabe, palibe zatsopano zomwe zidzawonjezedwe kwa izo.

Ma modals ndi zotsitsa pa mafoni

Kusefukira ndi kupukusa

Thandizo overflow: hidden;pa <body>chinthucho ndi chochepa mu iOS ndi Android. Kuti izi zitheke, mukamadutsa pamwamba kapena pansi pa modal mu msakatuli uliwonse wa zidazo, zomwe <body>zili mkatimo zimayamba kusuntha. Onani Chrome bug #175502 (yokhazikika mu Chrome v40) ndi WebKit bug #153852 .

iOS malemba minda ndi scrolling

Pofika pa iOS 9.2, pomwe modal imatsegulidwa, ngati kukhudza koyambirira kwa mpukutu kumakhala m'malire a malemba <input>kapena a <textarea>, zomwe <body>zili pansi pa modal zidzasunthidwa m'malo mwa modal yokha. Onani cholakwika cha WebKit #153856 .

Chinthucho .dropdown-backdropsichimagwiritsidwa ntchito pa iOS mu nav chifukwa cha zovuta za z-indexing. Chifukwa chake, kuti mutseke zotsikira mu navbars, muyenera kudina mwachindunji chinthucho (kapena china chilichonse chomwe chingatsegule chochitika mu iOS ).

Kukulitsa msakatuli

Kuyang'ana masamba mosalephera kumapereka zinthu zakale muzinthu zina, mu Bootstrap ndi intaneti yonse. Kutengera ndi vuto, titha kukonza (fufuzani kaye kenako ndikutsegulanso ngati pakufunika kutero). Komabe, timakonda kunyalanyaza izi chifukwa nthawi zambiri alibe yankho lachindunji kupatula ma workaround achinyengo.

Zomata :hover/ :focuspa iOS

Ngakhale :hoverkuti sizingatheke pazida zambiri zogwira, iOS imatengera izi, zomwe zimapangitsa kuti pakhale masitayelo "omata" omwe amapitilira mukangodina chinthu chimodzi. Mitundu ya hover iyi imachotsedwa pokhapokha ogwiritsa ntchito agogoda chinthu china. Khalidweli limawonedwa ngati losayenera ndipo likuwoneka kuti silili vuto pazida za Android kapena Windows.

Pakutulutsa kwathu konse kwa v4 alpha ndi beta, tidaphatikiza nambala yosakwanira komanso yopereka ndemanga kuti mulowe mufunso lazankhani zomwe zingalepheretse masitayelo a hover pakusakatula zida zomwe zimatengera kuyendayenda. Ntchitoyi sinamalizidwe kapena kuthandizidwa, koma kuti tipewe kusweka kwathunthu, tasankha kusiya shim iyi ndikusunga zosakaniza ngati njira zazifupi zamakalasi abodza.

Kusindikiza

Ngakhale m'masakatuli ena amakono, kusindikiza kungakhale kosokoneza.

Monga Safari v8.0, kugwiritsa ntchito kalasi yokhazikika-width .containerkungayambitse Safari kugwiritsa ntchito font yaying'ono posindikiza. Onani nkhani #14868 ndi WebKit bug #138192 kuti mumve zambiri. Chimodzi mwazomwe mungachite ndi CSS iyi:

@media print {
  .container {
    width: auto;
  }
}

Android stock browser

Kuchokera m'bokosilo, Android 4.1 (ndiponso zotulutsa zatsopano) zimatumiza ndi pulogalamu ya Msakatuli ngati msakatuli wosankha (mosiyana ndi Chrome). Tsoka ilo, pulogalamu ya Msakatuli ili ndi zolakwika zambiri komanso zosagwirizana ndi CSS yonse.

Sankhani menyu

Pazinthu <select>, msakatuli wa stock wa Android sawonetsa zowongolera zam'mbali ngati pali ndi border-radius/ kapena borderkugwiritsidwa ntchito. (Onani funso ili la StackOverflow kuti mumve zambiri.) Gwiritsani ntchito kaduka kakang'ono ka khodi ili m'munsimu kuti muchotse CSS yolakwayo ndikupereka <select>ngati chinthu chosasinthidwa pa msakatuli wa stock wa Android. Wogwiritsa ntchito akununkhiza amapewa kusokoneza asakatuli a Chrome, Safari, ndi Mozilla.

<script>
$(function () {
  var nua = navigator.userAgent
  var isAndroid = (nua.indexOf('Mozilla/5.0') > -1 && nua.indexOf('Android ') > -1 && nua.indexOf('AppleWebKit') > -1 && nua.indexOf('Chrome') === -1)
  if (isAndroid) {
    $('select.form-control').removeClass('form-control').css('width', '100%')
  }
})
</script>

Mukufuna kuwona chitsanzo? Onani chiwonetsero cha JS Bin ichi.

Otsimikizira

Kuti apereke chidziwitso chabwino kwambiri kwa asakatuli akale ndi ngolo, Bootstrap imagwiritsa ntchito ma hacks a CSS m'malo angapo kulunjika CSS yapadera kumitundu ina ya asakatuli kuti azitha kuthana ndi nsikidzi mu osatsegula okha. Ma hacks awa momveka amapangitsa ovomerezeka a CSS kudandaula kuti ndiwosavomerezeka. M'malo angapo, timagwiritsanso ntchito zida za CSS zotuluka magazi zomwe sizinakhazikike bwino, koma zimagwiritsidwa ntchito pongowonjezera pang'onopang'ono.

Machenjezo ovomerezekawa alibe ntchito chifukwa gawo la CSS lathu lopanda chinyengo limatsimikizira bwino ndipo magawo omwe amasokoneza samasokoneza kugwira ntchito moyenera kwa gawo lopanda chinyengo, chifukwa chake timanyalanyaza dala machenjezo awa.

Zolemba zathu za HTML zilinso ndi machenjezo ang'onoang'ono komanso osafunikira a HTML chifukwa chophatikizira njira yothetsera vuto linalake la Firefox .