Ba navigateurs na ba appareils
Yekola na ntina ya ba navigateurs mpe ba appareils, kobanda na mikolo oyo kino na kala, oyo esungami na Bootstrap, bakisa mpe ba quirks mpe ba bugs eyebani mpo na moko na moko.
Bootstrap esalisaka ba sorties ya sika, ya stable ya ba navigateurs nionso ya minene na ba plateformes. Na Windows, tozali kopesa mabɔkɔ na Internet Explorer 10-11 / Microsoft Edge .
Ba navigateurs mosusu oyo esalela version ya sika ya WebKit, Blink, to Gecko, ezala directement to na nzela ya API ya vue web ya plateforme, esungami polele te. Kasi, Bootstrap esengeli (mbala mingi) kolakisa mpe kosala malamu na ba navigateurs oyo lokola. Ba informations ya soutien ya sikisiki mingi epesami awa na se.
Okoki kozwa gamme na biso ya ba navigateurs oyo esungami mpe ba versions na yango na bisopackage.json :
"browserslist": [
"last 1 major version",
">= 1%",
"Chrome >= 45",
"Firefox >= 38",
"Edge >= 12",
"Explorer >= 10",
"iOS >= 9",
"Safari >= 9",
"Android >= 4.4",
"Opera >= 30"
]
Tosalelaka Autoprefixer mpo na kosimba lisungi ya navigateur oyo ekanamaki na nzela ya ba préfixes ya CSS, oyo esalela Browserslist mpo na kotambwisa ba versions ya navigateur oyo. Tala mikanda na bango pona ndenge nini okoki kosangisa bisaleli oyo na ba projets na yo.
En général, Bootstrap esimbaka ba versions ya sika ya ba navigateurs par défaut ya plateforme moko na moko ya munene. Yeba ete ba navigateurs proxy (lokola Opera Mini, mode Turbo ya Opera Mobile, UC Browser Mini, Amazon Silk) esimbami te.
| Chrome | Firefox ezali | Safari ya kosala | Navigateur Android & Vue ya Web | Microsoft Edge | |
|---|---|---|---|---|---|
| Android | Esungami | Esungami | N/A | Android v5.0+ esungami | Esungami |
| iOS | Esungami | Esungami | Esungami | N/A | Esungami |
| Windows 10 Ezali na nzela ya telefone | N/A | N/A | N/A | N/A | Esungami |
Ndenge moko mpe, ba versions ya sika ya ba navigateurs mingi ya bureau esimbami.
| Chrome | Firefox ezali | Explorateur ya Internet | Microsoft Edge | Opéra | Safari ya kosala | |
|---|---|---|---|---|---|---|
| Mac oyo azali | Esungami | Esungami | N/A | N/A | Esungami | Esungami |
| Bafenetre | Esungami | Esungami | Esungami, IE10+ | Esungami | Esungami | Esungami te |
Mpo na Firefox, longola bobimisi ya sika ya stable ya momesano, tozali mpe kosunga version ya sika ya bobimisi ya lisungi ya monene (ESR) ya Firefox.
Na ndenge ya ofele te, Bootstrap esengeli kotala mpe komitambwisa malamu mpenza na Chromium mpe Chrome mpo na Linux, Firefox mpo na Linux, mpe Internet Explorer 9, atako esungami officiellement te.
Mpo na liste ya mwa ba bugs ya navigateur oyo Bootstrap esengeli kobunda na yango, tala Mur na biso ya ba bugs ya navigateur .
Internet Explorer 10+ ezali na lisungi; IE9 na se ezali te. Svp yeba ete ba propriétés mosusu ya CSS3 mpe ba éléments HTML5 esungami mobimba te na IE10, to esengaka ba propriétés préfixées mpo na fonctionnement mobimba. Kota Nakoki kosalela... mpo na koyeba makambo mosusu na ntina na lisungi ya navigateur ya makambo ya CSS3 mpe HTML5.
Soki ozali na mposa ya lisungi ya IE8-9, salelá Bootstrap 3. Ezali version oyo eleki stable ya code na biso mpe ezali kaka kosungama na ekipi na biso mpo na kobongisa makambo ya ntina mpe mbongwana ya mikanda. Kasi, makambo ya sika moko te ekobakisama na yango.
Soutien mpo overflow: hidden;na na <body>élément ezali assez limité na iOS mpe Android. Mpo na yango, ntango ozali koleka likoló to na nse ya modal moko na moko ya ba navigateurs ya baaparɛyi yango, <body>makambo oyo ezali na kati ekobanda kotambola. Tala likambo ya Chrome #175502 (ebongisamaki na Chrome v40) mpe likambo ya WebKit #153852 .
Kobanda na iOS 9.2, ntango modal ezali polele, soki kosimba ya ebandeli ya geste ya défilement ezali na kati ya ndelo ya textual <input>to a <textarea>, <body>makambo oyo ezali na nse ya modal ekozala défilé na esika ya modal yango moko. Tala likambo ya WebKit #153856 .
Elemento .dropdown-backdropyango esalelamaka te na iOS na nav mpo na complexité ya z-indexing. Na yango, mpo na kokanga ba dropdowns na ba navbars, esengeli o cliquer directement élément déroulant (to élément mosusu nionso oyo ekobeta événement ya clic na iOS ).
Zoom ya page e présenter inévitablement ba artifacts ya rendu na ba composants mosusu, ezala na Bootstrap mpe na reste ya web. Na kotalela likambo yango, tokoki kobongisa yango (luka liboso mpe na nsima kofungola likambo soki esengeli). Kasi, tozalaka na momeseno ya koboya makambo yango mpamba te mbala mingi bazalaka na solution directe te longola kaka ba workarounds ya hacky.
Atako :hoverekoki kosalema te na baaparɛyi mingi ya kosimba, iOS emekolaka ezaleli yango, mpe yango esalaka ete ba styles ya hover “kokangama” oyo eumelaka nsima ya kobɛta eloko moko. Ba styles oyo ya hover elongolamaka kaka tango ba usagers ba toucher élément mosusu. Etamboli oyo etalelami mingimingi lokola oyo elingi te mpe emonani ete ezali likambo te na baaparɛyi ya Android to ya Windows.
Na boumeli ya ba versions na biso ya v4 alpha mpe beta, tokɔtisaki code oyo ekokisami te mpe topesaki makanisi mpo na kopona na kati ya shim ya requête ya media oyo ekokanga ba styles ya hover na ba navigateurs ya dispositif tactile oyo ezo imiter hovering. Mosala oyo esilaki mobimba te to efungolamaki ata moke te, kasi mpo na koboya kobukana mobimba, tosili kopona koboya shim oyo mpe kobatela ba mixins lokola banzela mokuse mpo na ba pseudo-classes.
Ata na ba navigateurs mosusu ya mikolo oyo, imprimerie ekoki kozala quirky.
Kobanda na Safari v8.0, kosalela kelasi ya bonene ya kofanda .containerekoki kosala ete Safari esalela bonene ya makomi ya moke mpenza ntango ezali konyata. Tala nimero #14868 mpe WebKit bug #138192 mpo na koyeba makambo mingi. Moko ya makambo oyo ekoki kosilisa yango ezali CSS oyo elandi:
@media print {
.container {
width: auto;
}
}Out of the box, Android 4.1 (et même ba sorties ya sika apparemment) envoyé na app Navigateur comme navigateur web par défaut ya choix (na bokeseni na Chrome). Malheureusement, appli Navigateur ezali na ebele ya ba bugs mpe ba inconsistance na CSS en général.
Na <select>ba éléments, navigateur stock Android ekolakisama te ba contrôles ya côté soki ezali na border-radiusmpe/to borderesalemi. (Talá motuna oyo ya StackOverflow mpo na koyeba makambo mosusu.) Salelá mwa ndambo ya code oyo ezali awa na nse mpo na kolongola CSS oyo ezali kozokisa mpe komonisa <select>lokola eloko oyo ezali na lolenge te na navigateur stock ya Android. Sniffing ya agent ya mosaleli ekimi interférence na ba navigateurs Chrome, Safari, mpe 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>Olingi komona ndakisa moko? Tala démonstration oyo ya JS Bin.
Pona kopesa expérience ya malamu koleka na ba navigateurs ya kala pe ya ba buggy, Bootstrap esalelaka ba hacks ya navigateur CSS na bisika ebele pona ko cibler CSS spécial na ba versions ya navigateur mosusu pona ko travailler autour ya ba bugs na ba navigateurs yango moko. Ba hacks oyo compréhensiblement esalaka que ba validateurs ya CSS ba se plaindre que bazali invalides. Na bisika mibale, tosalelaka mpe makambo ya CSS oyo ezali kobima makila oyo ezali naino te mobimba na ndenge oyo ebongi, kasi oyo esalelami kaka mpo na kobongisa makambo oyo ezali kokende liboso.
Ba avertissements oyo ya validation ezali na tina te na pratique puisque portion non hacky ya CSS na biso e valider entièrement mpe ba portions hacky e interférer te na fonctionnement correct ya portion non hacky, d'où pourquoi to ignorer délibérément ba avertissements oyo particulier.
Ba docs na biso ya HTML ezali mpe na mwa makebisi ya validation HTML oyo ezali na ntina te mpe oyo ezali na ntina te mpo na kokɔtisa na biso likambo ya kosilisa likambo moko boye ya Firefox .