Mucukumbuzi n'ibikoresho
Wige ibijyanye na mushakisha n'ibikoresho, kuva kijyambere kugeza kera, bishyigikiwe na Bootstrap, harimo ibisobanuro bizwi na bugi kuri buri.
Mucukumbuzi
Bootstrap ishyigikira ibyasohotse vuba, bihamye bya mushakisha nini zose. Kuri Windows, dushyigikira Internet Explorer 10-11 / Microsoft Edge .
Ubundi mushakisha ukoresha verisiyo yanyuma ya WebKit, Blink, cyangwa Gecko, haba muburyo butaziguye cyangwa binyuze kumurongo wurubuga rwa API, ntabwo bashyigikiwe neza. Ariko, Bootstrap igomba (mubihe byinshi) kwerekana no gukora neza muriyi mushakisha. Ibisobanuro birambuye byingirakamaro byatanzwe hano hepfo.
Urashobora kubona urwego rushyigikiwe rwa mushakisha hamwe na verisiyo zabo muri.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
Dukoresha Autoprefixer kugirango dukemure inkunga igenewe mushakisha dukoresheje prefixes ya CSS, ikoresha Browserslist kugirango icunge verisiyo ya mushakisha. Reba inyandiko zabo zuburyo bwo kwinjiza ibyo bikoresho mumishinga yawe.
Ibikoresho bigendanwa
Mubisanzwe, Bootstrap ishyigikira verisiyo yanyuma ya buri platform nkuru idasanzwe. Menya ko mushakisha ya porokisi (nka Opera Mini, uburyo bwa Turbo bwa Opera Mobile, UC Browser Mini, Amazone Silk) idashyigikiwe.
Chrome | Firefox | Safari | Mucukumbuzi ya Android & Urubuga | Microsoft Edge | |
---|---|---|---|---|---|
Android | Gushyigikirwa | Gushyigikirwa | N / A. | Android v5.0 + ishyigikiwe | Gushyigikirwa |
iOS | Gushyigikirwa | Gushyigikirwa | Gushyigikirwa | N / A. | Gushyigikirwa |
Windows 10 Igendanwa | N / A. | N / A. | N / A. | N / A. | Gushyigikirwa |
Mucukumbuzi ya desktop
Muri ubwo buryo ,, verisiyo yanyuma ya mushakisha ya desktop hafi ya yose irashyigikiwe.
Chrome | Firefox | Internet Explorer | Microsoft Edge | Opera | Safari | |
---|---|---|---|---|---|---|
Mac | Gushyigikirwa | Gushyigikirwa | N / A. | Gushyigikirwa | Gushyigikirwa | Gushyigikirwa |
Windows | Gushyigikirwa | Gushyigikirwa | Bishyigikiwe, IE10 + | Gushyigikirwa | Gushyigikirwa | Ntabwo ashyigikiwe |
Kuri Firefox, hiyongereyeho gusohora bisanzwe bisanzwe bihamye, dushyigikire kandi verisiyo yanyuma yagutse (ESR) verisiyo ya Firefox.
Mu buryo butemewe, Bootstrap igomba kureba no kwitwara neza bihagije muri Chromium na Chrome kuri Linux, Firefox ya Linux, na Internet Explorer 9, nubwo bidashyigikiwe kumugaragaro.
Kurutonde rwa bimwe mubikoresho bya mushakisha Bootstrap igomba guhangana nabyo, reba Urukuta rwacu rwa mushakisha .
Internet Explorer
Internet Explorer 10+ irashyigikiwe; IE9 no hepfo ntabwo. Nyamuneka umenye ko ibintu bimwe na bimwe bya CSS3 nibintu bya HTML5 bidashyigikiwe byuzuye muri IE10, cyangwa bisaba imitungo yabanjirije gukora neza. Sura Nshobora gukoresha… kubisobanuro birambuye kubufasha bwa mushakisha ya CSS3 na HTML5. Niba ukeneye inkunga ya IE8-9, koresha Bootstrap 3.
Uburyo no kumanuka kuri mobile
Kurengerwa no kuzunguruka
Inkunga overflow: hidden;
kuri <body>
element ni ntarengwa muri iOS na Android. Kugirango bigerweho, mugihe uzengurutse hejuru cyangwa hepfo ya modal muri kimwe muri ibyo bikoresho bya mushakisha, <body>
ibirimo bizatangira kuzunguruka. Reba amakosa ya Chrome # 175502 (yakosowe muri Chrome v40) na WebKit bug # 153852 .
iOS inyandiko yumurima hamwe no kuzunguruka
Nko kuri iOS 9.2, mugihe modal ifunguye, niba gukoraho kwambere ibimenyetso byerekana umuzingo biri mumupaka winyandiko <input>
cyangwa a <textarea>
, <body>
ibirimo munsi yuburyo bizunguruka aho kuba modal ubwayo. Reba WebKit bug # 153856 .
Kumanuka Kumurongo
Ikintu .dropdown-backdrop
ntabwo gikoreshwa kuri iOS muri nav kubera ubunini bwa z-indangagaciro. Rero, kugirango ufunge ibitonyanga muri navbars, ugomba guhita ukanda ibintu byamanutse (cyangwa ikindi kintu icyo aricyo cyose kizarasa ibyabaye muri iOS ).
Mucukumbuzi
Page zooming byanze bikunze yerekana ibihangano mubice bimwe, haba muri Bootstrap hamwe nizindi mbuga. Ukurikije ikibazo, dushobora gushobora kugikemura (shakisha mbere hanyuma ufungure ikibazo nibiba ngombwa). Ariko, dukunze kwirengagiza ibi kuko akenshi nta gisubizo kiboneye usibye akazi keza.
Kwizirika :hover
/ :focus
kuri iOS
Mugihe :hover
bidashoboka kubikoresho byinshi byo gukoraho, iOS yigana iyi myitwarire, bikavamo uburyo bwa "sticky" hover ikomeza nyuma yo gukanda ikintu kimwe. Imiterere ya hover ikurwaho gusa mugihe abakoresha bakanze ikindi kintu. Iyi myitwarire ifatwa ahanini itifuzwa kandi bigaragara ko atari ikibazo kubikoresho bya Android cyangwa Windows.
Mubisohoka v4 alpha na beta twasohoye, twashyizemo kode ituzuye kandi itanga ibisobanuro kode yo guhitamo mubitangazamakuru byabajijwe shim byahagarika uburyo bwa hover muburyo bwo gukoraho ibikoresho byigana kwigana. Uyu murimo ntiwigeze urangira neza cyangwa ngo ushoboke, ariko kugirango twirinde kumeneka burundu, twahisemo gutesha agaciro iyi shim no gukomeza kuvanga nka shortcuts kumasomo ya pseudo.
Gucapa
Ndetse no muri mushakisha zimwe zigezweho, icapiro rirashobora kuba ikibazo.
Nko kuri Safari v8.0, gukoresha ikoreshwa ryubugari bwagutse .container
birashobora gutuma Safari ikoresha ingano yimyandikire idasanzwe mugihe icapa. Reba ikibazo # 14868 na WebKit bug # 138192 kugirango ubone ibisobanuro birambuye. Ikintu kimwe gishoboka ni CSS ikurikira:
@media print {
.container {
width: auto;
}
}
Mucukumbuzi ya Android
Hanze y'agasanduku, Android 4.1 (ndetse na bimwe bishya bisohoka bigaragara) yoherejwe na porogaramu ya Browser nka mushakisha y'urubuga isanzwe ihitamo (bitandukanye na Chrome). Kubwamahirwe, porogaramu ya Browser ifite amakosa menshi kandi idahuye na CSS muri rusange.
Hitamo menu
Kubintu <select>
, mushakisha yimigabane ya Android ntizerekana kugenzura kuruhande niba hari border-radius
na / cyangwa border
byashyizwe mubikorwa. . _ _ <select>
_ Umukoresha ukoresha kunuka yirinda kwivanga muri mushakisha ya Chrome, Safari, na 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>
Urashaka kubona urugero? Reba kuri iyi JS Bin demo .
Abemeza
Kugirango utange uburambe bwiza bushoboka kuri mushakisha zishaje na buggy, Bootstrap ikoresha amashanyarazi ya CSS ahantu henshi kugirango yereke CSS idasanzwe kuri verisiyo zimwe na zimwe za mushakisha kugirango ikore hafi yamakosa muri mushakisha ubwabo. Izi hack birumvikana ko abemeza CSS binubira ko bitemewe. Ahantu habiri, dukoresha kandi kuva amaraso-CSS ibiranga bitaruzuzwa neza, ariko bikoreshwa gusa mukuzamura iterambere.
Iyi miburo yo kwemeza ntacyo itwaye mubikorwa kuva igice kitari hacki cya CSS yacu cyemeza neza kandi ibice bya hacky ntibibangamira imikorere myiza yigice kitari hacky, niyo mpamvu twirengagiza nkana iyi miburo yihariye.
Inyandiko zacu za HTML nazo zifite imburi zidafite akamaro kandi zidafite ishingiro zo kwemeza HTML kubera ko dushyiramo akazi kubikorwa bya Firefox runaka .