Ihe nchọgharị na ngwaọrụ
Mụta maka ihe nchọgharị na ngwaọrụ, site na ọgbara ọhụrụ ruo nke ochie, nke Bootstrap na-akwado, gụnyere quirks na ahụhụ ndị ama ama maka nke ọ bụla.
Bootstrap na-akwado mwepụta kacha ọhụrụ, kwụsiri ike nke ihe nchọgharị na nyiwe niile. Na Windows, anyị na-akwado Internet Explorer 10-11 / Microsoft Edge .
Ihe nchọgharị ọzọ nke na-eji ụdị WebKit, Blink ma ọ bụ Gecko kachasị ọhụrụ, ma ọ bụ ozugbo ma ọ bụ site na API nlele webụ nke ikpo okwu, anaghị akwado nke ọma. Agbanyeghị, Bootstrap kwesịrị (n'ọtụtụ oge) gosipụta ma rụọ ọrụ nke ọma na ihe nchọgharị ndị a. Enyere ozi nkwado ndị ọzọ n'okpuru.
Ị nwere ike ịchọta ụdị ihe nchọgharị anyị na-akwado yana ụdị ha na nke anyịpackage.json :
"browserslist": [
"last 1 major version",
">= 1%",
"Chrome >= 45",
"Firefox >= 38",
"Edge >= 12",
"Explorer >= 10",
"iOS >= 9",
"Safari >= 9",
"Android >= 4.4",
"Opera >= 30"
]
Anyị na-eji Autoprefixer iji jikwaa nkwado ihe nchọgharị e bu n'obi site na prefixes CSS, nke na-eji Browserslist iji jikwaa ụdị ihe nchọgharị ndị a. Lelee akwụkwọ ha maka otu esi etinye ngwa ndị a na ọrụ gị.
N'ikwu okwu n'ozuzu, Bootstrap na-akwado nsụgharị kachasị ọhụrụ nke ihe nchọgharị ndabere nke ikpo okwu ọ bụla. Rịba ama na akwadoghị ihe nchọgharị proxy (dị ka Opera Mini, Opera Mobile's Turbo mode, UC Browser Mini, Amazon Silk).
| Chrome | Firefox | Safari | Ihe nchọgharị Android & WebView | Microsoft Edge | |
|---|---|---|---|---|---|
| Android | Akwadoro | Akwadoro | N/A | Android v5.0+ kwadoro | Akwadoro |
| iOS | Akwadoro | Akwadoro | Akwadoro | N/A | Akwadoro |
| Windows 10 Mobile | N/A | N/A | N/A | N/A | Akwadoro |
N'otu aka ahụ, a na-akwado ụdị kachasị ọhụrụ nke ọtụtụ ihe nchọgharị desktọpụ.
| Chrome | Firefox | Internet Explorer | Microsoft Edge | Opera | Safari | |
|---|---|---|---|---|---|---|
| Mac | Akwadoro | Akwadoro | N/A | N/A | Akwadoro | Akwadoro |
| Windows | Akwadoro | Akwadoro | Akwadoro, IE10+ | Akwadoro | Akwadoro | akwadoghị |
Maka Firefox, na mgbakwunye na ntọhapụ kwụsiri ike kachasị ọhụrụ, anyị na-akwado ụdị Mwepụta Nkwado Extended (ESR) nke Firefox kachasị ọhụrụ.
Na-akwadoghị, Bootstrap kwesịrị ịdị na-ele anya ma na-akpa àgwà nke ọma na Chromium na Chrome maka Linux, Firefox maka Linux, na Internet Explorer 9, n'agbanyeghị na akwadoghị ha.
Maka ndepụta ụfọdụ ahụhụ ihe nchọgharị nke Bootstrap ga-ejiri, hụ Wall of browser bugs .
Internet Explorer 10+ na-akwado; IE9 na ala abụghị. Biko mara na ụfọdụ akụrụngwa CSS3 na ihe HTML5 akwadoghị nke ọma na IE10, ma ọ bụ chọọ akụrụngwa etinyegoro maka ịrụ ọrụ zuru oke. Gaa leta Enwere m ike iji… maka nkọwa na nkwado nchọgharị nke njirimara CSS3 na HTML5.
Ọ bụrụ na ịchọrọ nkwado IE8-9, jiri Bootstrap 3. Ọ bụ ụdị koodu anyị kachasị kwụsiri ike ma ndị otu anyị na-akwado maka mgbanwe nhụzi dị egwu na akwụkwọ. Agbanyeghị, ọ nweghị atụmatụ ọhụrụ a ga-agbakwunye na ya.
Nkwado maka overflow: hidden;mmewere <body>dị oke na iOS na gam akporo. Iji mezuo nke ahụ, mgbe ị pịrịga n'elu ma ọ bụ ala nke modal na nke ọ bụla n'ime ihe nchọgharị ngwaọrụ ndị ahụ, <body>ọdịnaya ga-amalite ịpịgharịa. Hụ ahụhụ Chrome #175502 (nke edobere na Chrome v40) yana ahụhụ WebKit #153852 .
Dị ka nke iOS 9.2, mgbe modal na-emeghe, ọ bụrụ na mmetụ mbụ nke mmegharị akwụkwọ mpịakọta dị n'ime oke ederede <input>ma ọ bụ a <textarea>, a <body>ga-atụgharị ọdịnaya dị n'okpuru modal kama modal n'onwe ya. Lee ahụhụ WebKit #153856 .
A .dropdown-backdropnaghị eji ihe ahụ eme ihe na iOS na ụgbọ mmiri n'ihi mgbagwoju anya nke z-indexing. Ya mere, imechi dropdowns na navbars, ị ga-pịa ozugbo dropdown element (ma ọ bụ ihe ọ bụla ọzọ mmewere nke ga-ọkụ a click omume na iOS ).
Mbugharị ibe na-enweghị atụ na-egosi ihe arụrụ arụ na akụkụ ụfọdụ, ma na Bootstrap na webụ ndị ọzọ. Dabere n'okwu a, anyị nwere ike idozi ya (chọọ na mbụ wee mepee esemokwu ma ọ bụrụ na ọ dị mkpa). Agbanyeghị, anyị na-eleghara ihe ndị a anya n'ihi na ha anaghị enwekarị azịza ọ bụla ma ọ bụghị ihe mgbakasị ahụ.
Ọ :hoverbụ ezie na ọ gaghị ekwe omume n'ọtụtụ ngwaọrụ mmetụ, iOS na-eṅomi omume a, na-ebute ụdị "na-arapara" nke na-adịgide adịgide mgbe ịpịrị otu mmewere. A na-ewepụ ụdị hover ndị a naanị mgbe ndị ọrụ kpatụ mmewere ọzọ. A na-ewere omume a dị ka ihe na-adịghị mma yana ọ dị ka ọ bụghị nsogbu na ngwaọrụ gam akporo ma ọ bụ Windows.
N'ime mwepụta v4 alpha na beta anyị, anyị gụnyere koodu na-ezughị ezu ma kwupụta koodu maka ịbanye na ajụjụ mgbasa ozi nke ga-ewepụ ụdị hover na ihe nchọgharị ngwaọrụ ndị na-eṅomi hovering. Emechabeghị ma ọ bụ nwee ike rụọ ọrụ a nke ọma, mana iji zere nbiji zuru oke, anyị ahọrọla ibibi shim a ma dobe mixins dị ka ụzọ mkpirisi maka klaasị pseudo.
Ọbụlagodi na ụfọdụ ihe nchọgharị ọgbara ọhụrụ, ibipụta nwere ike ịdị egwu.
Dịka nke Safari v8.0, iji .containerklaasị nwere obosara nwere ike ime ka Safari jiri nha mkpụrụedemede na-enweghị atụ mgbe ọ na-ebi akwụkwọ. Hụ mbipụta #14868 na ahụhụ WebKit #138192 maka nkọwa ndị ọzọ. Otu ihe nwere ike ime bụ CSS:
@media print {
.container {
width: auto;
}
}N'ime igbe ahụ, Android 4.1 (na ọbụna ụfọdụ ntọhapụ ọhụrụ doro anya) jiri ngwa ihe nchọgharị na-ebufe dị ka ihe nchọgharị weebụ nke nhọrọ (na-emegide Chrome). N'ụzọ dị mwute, ngwa ihe nchọgharị ahụ nwere ọtụtụ chinchi na ekwekọghị ekwekọ na CSS n'ozuzu ya.
Na <select>ọcha, ihe nchọgharị ngwaahịa gam akporo agaghị egosipụta njikwa akụkụ ma ọ bụrụ na enwere border-radiusna/ma ọ bụ bordertinye ya n'ọrụ. (Lee ajụjụ StackOverflow a maka nkọwa.) Jiri snippet nke koodu dị n'okpuru wepụ CSS na-akpasu iwe wee mee ya <select>ka ọ bụrụ ihe na-enweghị usoro na ihe nchọgharị ngwaahịa gam akporo. Onye ọrụ na-eku ume na-ezere ndabichi na ihe nchọgharị 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>Chọrọ ịhụ ihe atụ? Lelee ihe ngosi JS Bin a.
Iji nye ahụmịhe kachasị mma maka ihe nchọgharị ochie na nke na-adịghị mma, Bootstrap na-eji hacks ihe nchọgharị CSS n'ọtụtụ ebe iji kwado CSS pụrụ iche na ụdị ihe nchọgharị ụfọdụ iji rụọ ọrụ gburugburu ahụhụ na ihe nchọgharị ahụ n'onwe ha. Mbanye anataghị ikike ndị a na-eme ka ndị nkwado CSS na-eme mkpesa na ha adịghị mma. N'ebe di na nwunye, anyị na-ejikwa njirimara CSS ọnụ na-agba ọbara nke na-edobebeghị nke ọma, mana a na-eji ndị a naanị maka nkwalite na-aga n'ihu.
Ịdọ aka ná ntị nkwado ndị a adịghị mkpa na omume ebe akụkụ na-adịghị eme ihe ike nke CSS anyị kwadoro nke ọma yana akụkụ ndị ahụ na-adịghị mma anaghị egbochi ọrụ nke ọma nke akụkụ ahụ na-adịghị mma, ya mere anyị ji kpachara anya na-eleghara ịdọ aka ná ntị ndị a anya.
Docs HTML anyị nwekwara ụfọdụ ịdọ aka ná ntị nkwado HTML na-adịghị mkpa na nke na-adịghị mkpa n'ihi ntinye anyị na-arụ ọrụ maka ụfọdụ ahụhụ Firefox .