Mabhurawuza uye zvishandiso
Dzidza nezvemabhurawuza uye zvishandiso, kubva zvazvino kusvika zvekare, zvinotsigirwa neBootstrap, kusanganisira zvinozivikanwa quirks uye tsikidzi kune yega yega.
Mabhurawuza anotsigirwa
Bootstrap inotsigira ichangoburwa, yakagadzikana kuburitswa kwese makuru mabhurawuza uye mapuratifomu. PaWindows, tinotsigira Internet Explorer 10-11 / Microsoft Edge .
Mamwe mabhurawuza anoshandisa yazvino vhezheni yeWebKit, Blink, kana Gecko, ingave yakananga kana kuburikidza neyepuratifomu yewebhu yekuona API, haina kutsigirwa zvakajeka. Nekudaro, Bootstrap inofanirwa (munguva zhinji) kuratidza uye kushanda nemazvo mumabhurawuza aya zvakare. Ruzivo rwakawanda rwerutsigiro rwunopihwa pazasi.
Unogona kuwana mabhurawuza edu anotsigirwa neshanduro dzawo mune yedu.browserslistrc file :
# https://github.com/browserslist/browserslist#readme
>= 1%
last 1 major version
not dead
Chrome >= 45
Firefox >= 38
Edge >= 12
Explorer >= 10
iOS >= 9
Safari >= 9
Android >= 4.4
Opera >= 30
Isu tinoshandisa Autoprefixer kubata inotarirwa bhurawuza rutsigiro kuburikidza neCSS prefixes, iyo inoshandisa Browserslist kubata idzi shanduro dzebrowser. Tarisa zvinyorwa zvavo kuti ungabatanidza sei maturusi aya mumapurojekiti ako.
Mobile midziyo
Kazhinji kutaura, Bootstrap inotsigira ichangoburwa vhezheni yega yega hombe yepuratifomu mabhurawuza. Ziva kuti mabhurawuza (akadai seOpera Mini, Opera Mobile's Turbo modhi, UC Browser Mini, Amazon Silk) haatsigirwe.
| Chrome | Firefox | Safari | Android Browser & WebView | Microsoft Edge | |
|---|---|---|---|---|---|
| Android | Inotsigirwa | Inotsigirwa | N/A | Android v5.0+ inotsigirwa | Inotsigirwa |
| iOS | Inotsigirwa | Inotsigirwa | Inotsigirwa | N/A | Inotsigirwa |
| Windows 10 Mobile | N/A | N/A | N/A | N/A | Inotsigirwa |
Desktop browsers
Saizvozvo, ichangoburwa vhezheni yeakawanda desktop browser anotsigirwa.
| Chrome | Firefox | Internet Explorer | Microsoft Edge | Opera | Safari | |
|---|---|---|---|---|---|---|
| Mac | Inotsigirwa | Inotsigirwa | N/A | Inotsigirwa | Inotsigirwa | Inotsigirwa |
| Windows | Inotsigirwa | Inotsigirwa | Inotsigirwa, IE10+ | Inotsigirwa | Inotsigirwa | Haisi kutsigirwa |
YeFirefox, mukuwedzera kune yazvino yakajairwa kuburitswa, isu tinotsigirawo yazvino Yakawedzerwa Rutsigiro Kuburitswa (ESR) vhezheni yeFirefox.
Zvisina pamutemo, Bootstrap inofanirwa kutarisa uye kuzvibata zvakanaka muChromium uye Chrome yeLinux, Firefox yeLinux, uye Internet Explorer 9, kunyangwe isingatsigirwe zviri pamutemo.
Kuti uwane runyoro rwemamwe mabhurawuza ebhurawuza ayo Bootstrap anofanirwa kugadzirisa nawo, ona yedu Wall yebrowser bugs .
Internet Explorer
Internet Explorer 10+ inotsigirwa; IE9 uye pasi haisi. Ndapota ziva kuti zvimwe zvivakwa zveCSS3 neHTML5 zvinhu hazvina kutsigirwa zvizere muIE10, kana kuti zvinoda prefixed zvivakwa kuti zvishande zvizere. Shanyira Ndinogona kushandisa… kune ruzivo nezverutsigiro rwebrowser yeCSS3 uye HTML5 maficha. Kana iwe uchida rutsigiro rweIE8-9, shandisa Bootstrap 3.
Modals uye kudonha pane mobile
Kufashukira uye kupuruzira
Tsigiro yechinhu overflow: hidden;pane <body>inogumira muIOS uye Android. Kuti izvozvo zviitike, kana iwe ukapfuura nepamusoro kana pasi pe modal mune chero yeaya mabhurawuza emidziyo, <body>zvirimo zvinotanga kupururudza. Ona Chrome bug #175502 (yakagadziriswa muChrome v40) uye WebKit bug #153852 .
iOS zvinyorwa zvinyorwa uye kupuruzira
Kubva paIOS 9.2, nepo modal yakavhurika, kana kubata kwekutanga kwemupumburu gesture kuri mukati memuganho wechinyorwa <input>kana a <textarea>, <body>zviri pasi peiyo modal zvichapepetwa pachinzvimbo cheiyo modal pachayo. Ona WebKit bug #153856 .
Navbar Dropdowns
Chinhu .dropdown-backdropchacho hachishandiswe paIOS mune nav nekuda kwekuoma kwez-indexing. Saka, kuvhara kudonhedza mumabhawa, iwe unofanirwa kudzvanya zvakananga chinhu chinodonha (kana chero chimwe chinhu chinopisa chiitiko chekudzvanya mu iOS ).
Browser zooming
Kufembera kwepeji kunopa zvisingadzivisiki kupa zvigadzirwa mune zvimwe zvikamu, zvese muBootstrap uye newebhu yese. Zvichienderana nenyaya, tinogona kuzvigadzirisa (tsvaga kutanga uye wozovhura nyaya kana zvichidikanwa). Nekudaro, isu tinowanzo kufuratira izvi sezvo ivo kazhinji vasina mhinduro yakananga kunze kwehacky workaround.
Inonamira :hover/ :focuspane iOS
Kunyange :hoverzvisingaite pamidziyo yakawanda yekubata, iOS inotevedzera maitiro aya, zvichikonzera "kunamira" hover masitaera anoenderera mushure mekudzvanya chinhu chimwe. Aya ma hover masitayipi anobviswa chete kana vashandisi vatora chimwe chinhu. Maitiro aya anoonekwa seasingafadzi uye anoita kunge isiri nyaya paAndroid kana Windows zvishandiso.
Munguva yedu yese v4 alpha uye beta kuburitswa, isu takasanganisira isina kukwana uye yakataura kunze kodhi yekusarudza kupinda mune midhiya yemubvunzo shim iyo inodzima hover masitaera mukubata mudziyo mabhurawuza anotevedzera hovering. Iri basa harina kumbopedzwa zvizere kana kugoneswa, asi kuti tidzivise kuputswa, takasarudza kusiya iyi shim uye kuchengeta mamisanganiswa semapfupi emakirasi emanyepo.
Kudhinda
Kunyangwe mune mamwe mabhurawuza emazuva ano, kudhinda kunogona kuve kwakaoma.
NezveSafari v8.0, kushandiswa kwekirasi-yakafara .containerkirasi kunogona kukonzera Safari kushandisa saizi diki isina kujairika pakudhinda. Ona chinyorwa #14868 uye WebKit bug #138192 kuti uwane rumwe ruzivo. Imwe inogona kushanda ndiyo inotevera CSS:
@media print {
.container {
width: auto;
}
}
Android stock browser
Kunze kwebhokisi, Android 4.1 (uye kunyangwe zvimwe zvitsva zvinoburitswa sezviri pachena) ngarava ine Browser app seye default web browser yesarudzo (kusiyana neChrome). Nehurombo, iyo Browser app ine akawanda mabhugi uye kusawirirana neCSS zvakazara.
Sarudza menyu
Pane <select>zvinhu, iyo Android stock browser haizoratidze iyo yedivi zvinodzora kana paine border-radiusuye / kana borderyakashandiswa. (Ona uyu mubvunzo weStackOverflow kuti uwane udzame.) Shandisa chidimbu chekodhi pazasi kuti ubvise CSS iri kugumbura uye ratidza <select>sechinhu chisina kunyorwa paAndroid stock browser. Mushandisi anofemba anodzivirira kukanganiswa neChrome, Safari, uye Mozilla browser.
<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>
Unoda kuona muenzaniso? Tarisa iyi JS Bin demo .
Validators
Kuti ipe ruzivo rwepamusoro kune ekare uye mabhurawuza, Bootstrap inoshandisa CSS browser hacks munzvimbo dzinoverengeka kunanga yakakosha CSS kune dzimwe shanduro dzebrowser kuitira kuti ushande zvakatenderedza mabhugi mumabhurawuza pachawo. Aya hacks zvinonzwisisika anokonzera CSS validators kunyunyuta kuti haakodzeri. Munzvimbo dzakati wandei, isu tinoshandisawo kubuda ropa-kumucheto CSS maficha asati anyatso mira, asi aya anoshandiswa chete kufambira mberi.
Idzi yambiro dzekusimbisa hadzina basa mukuita sezvo iyo isiri-hacky chikamu cheCSS yedu ichinyatso simbisa uye zvikamu zvehacky hazvikanganise nekushanda kwakanaka kwechikamu chisiri chehacky, saka nei tichiregeredza nemaune yambiro idzi.
Mapepa edu eHTML anewo yambiro diki uye isingakoshesi yeHTML nekuda kwekubatanidzwa kwedu kwekugadzirisa kune imwe Firefox bug .