Brskalniki in naprave
Izvedite več o brskalnikih in napravah, od sodobnih do starih, ki jih podpira Bootstrap, vključno z znanimi posebnostmi in napakami za vsakega.
Bootstrap podpira najnovejše, stabilne izdaje vseh glavnih brskalnikov in platform. V sistemu Windows podpiramo Internet Explorer 10-11 / Microsoft Edge .
Alternativni brskalniki, ki uporabljajo najnovejšo različico WebKit, Blink ali Gecko, neposredno ali prek API-ja spletnega pogleda platforme, niso izrecno podprti. Vendar bi se moral Bootstrap (v večini primerov) pravilno prikazati in delovati tudi v teh brskalnikih. Podrobnejše informacije o podpori so navedene spodaj.
Našo podprto paleto brskalnikov in njihovih različic najdete v našempackage.json :
"browserslist": [
"last 1 major version",
">= 1%",
"Chrome >= 45",
"Firefox >= 38",
"Edge >= 12",
"Explorer >= 10",
"iOS >= 9",
"Safari >= 9",
"Android >= 4.4",
"Opera >= 30"
]
Autoprefixer uporabljamo za obravnavanje predvidene podpore brskalnika prek predpon CSS, ki uporablja seznam brskalnikov za upravljanje teh različic brskalnika. Oglejte si njihovo dokumentacijo, kako integrirati ta orodja v svoje projekte.
Na splošno Bootstrap podpira najnovejše različice privzetih brskalnikov vsake glavne platforme. Upoštevajte, da brskalniki proxy (kot so Opera Mini, Turbo način Opera Mobile, UC Browser Mini, Amazon Silk) niso podprti.
| Chrome | Firefox | Safari | Brskalnik Android & WebView | Microsoft Edge | |
|---|---|---|---|---|---|
| Android | Podprto | Podprto | N/A | Android v5.0+ podprt | Podprto |
| iOS | Podprto | Podprto | Podprto | N/A | Podprto |
| Windows 10 Mobile | N/A | N/A | N/A | N/A | Podprto |
Podobno so podprte najnovejše različice večine namiznih brskalnikov.
| Chrome | Firefox | internet Explorer | Microsoft Edge | Opera | Safari | |
|---|---|---|---|---|---|---|
| Mac | Podprto | Podprto | N/A | N/A | Podprto | Podprto |
| Windows | Podprto | Podprto | Podprto, IE10+ | Podprto | Podprto | Ne podpira |
Za Firefox poleg najnovejše normalne stabilne izdaje podpiramo tudi najnovejšo različico Firefoxa z razširjeno podporo (ESR) .
Neuradno naj bi Bootstrap izgledal in se dovolj dobro obnašal v Chromiumu in Chromu za Linux, Firefoxu za Linux in Internet Explorerju 9, čeprav uradno nista podprta.
Za seznam nekaterih hroščev v brskalniku, s katerimi se mora spopasti Bootstrap, si oglejte naš Zid hroščev v brskalniku .
Podprt je Internet Explorer 10+; IE9 in nižje ni. Upoštevajte, da nekatere lastnosti CSS3 in elementi HTML5 niso v celoti podprti v IE10 ali pa zahtevajo predpone lastnosti za polno funkcionalnost. Obiščite Ali lahko uporabim… za podrobnosti o podpori brskalnika za funkcije CSS3 in HTML5.
Če potrebujete podporo za IE8-9, uporabite Bootstrap 3. Je najbolj stabilna različica naše kode in jo naša ekipa še vedno podpira za kritične popravke napak in spremembe dokumentacije. Vendar mu ne bodo dodane nove funkcije.
Podpora za overflow: hidden;element <body>je v sistemih iOS in Android precej omejena. V ta namen, ko se pomaknete mimo vrha ali dna modala v katerem koli od brskalnikov teh naprav, se bo <body>vsebina začela pomikati. Oglejte si napako Chrome #175502 (odpravljeno v Chromu v40) in napako WebKit #153852 .
Od iOS 9.2, medtem ko je modal odprt, se bo, če je začetni dotik poteze drsenja znotraj meje besedila <input>ali <textarea>, <body>pomikala vsebina pod modalom namesto samega modala. Oglejte si napako WebKit #153856 .
Element .dropdown-backdropse v sistemu iOS ne uporablja v navigaciji zaradi zapletenosti z-indeksiranja. Če želite zapreti spustne menije v vrsticah za krmarjenje, morate neposredno klikniti spustni element (ali kateri koli drug element, ki bo sprožil dogodek klika v sistemu iOS ).
Povečevanje strani neizogibno predstavlja artefakte upodabljanja v nekaterih komponentah, tako v Bootstrapu kot preostalem spletu. Glede na težavo jo bomo morda lahko odpravili (najprej poiščite in nato po potrebi odprite težavo). Vendar jih običajno ignoriramo, saj pogosto nimajo neposredne rešitve, razen hekerskih rešitev.
Čeprav :hoverto ni mogoče na večini naprav na dotik, iOS posnema to vedenje, kar ima za posledico »lepljive« sloge lebdenja, ki ostanejo po dotiku enega elementa. Ti slogi lebdenja se odstranijo samo, ko uporabniki tapnejo drug element. To vedenje velja za večinoma nezaželeno in zdi se, da ni težava v napravah Android ali Windows.
Skozi naše izdaje v4 alfa in beta smo vključili nepopolno in komentirano kodo za izbiro medijske poizvedbe, ki bi onemogočila sloge lebdenja v brskalnikih naprav na dotik, ki posnemajo lebdenje. To delo ni bilo nikoli v celoti dokončano ali omogočeno, a da bi se izognili popolnemu zlomu, smo se odločili, da opustimo to podlogo in obdržimo miksine kot bližnjice za psevdo-razrede.
Tudi v nekaterih sodobnih brskalnikih je lahko tiskanje nenavadno.
Od Safarija v8.0 lahko uporaba razreda s fiksno širino .containerpovzroči, da Safari pri tiskanju uporablja nenavadno majhno velikost pisave. Za več podrobnosti si oglejte težavo #14868 in napako WebKit #138192 . Ena možna rešitev je naslednji CSS:
@media print {
.container {
width: auto;
}
}Android 4.1 (in očitno celo nekatere novejše izdaje) že takoj prejmejo aplikacijo Browser kot privzeti izbrani spletni brskalnik (v nasprotju s Chromom). Na žalost ima aplikacija Brskalnik veliko napak in nedoslednosti s CSS na splošno.
Na <select>elementih standardni brskalnik Android ne bo prikazal stranskih kontrolnikov, če je uporabljen border-radiusin/ali border. (Za podrobnosti si oglejte to vprašanje StackOverflow .) Uporabite spodnji delček kode, da odstranite žaljivi CSS in upodabljate <select>element kot element brez sloga v brskalniku zaloge Android. Vohanje uporabniškega agenta se izogne motnjam v brskalnikih Chrome, Safari in 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>Želite videti primer? Oglejte si to predstavitev JS Bin.
Da bi zagotovil najboljšo možno izkušnjo starim brskalnikom in brskalnikom z napakami, Bootstrap na več mestih uporablja vdore v brskalnike CSS , da cilja posebne CSS na določene različice brskalnikov, da se izogne napakam v samih brskalnikih. Ti vdori razumljivo povzročijo, da se validatorji CSS pritožujejo, da so neveljavni. Na nekaj mestih uporabljamo tudi najsodobnejše funkcije CSS, ki še niso povsem standardizirane, vendar se uporabljajo zgolj za postopno izboljšavo.
Ta opozorila pri preverjanju veljavnosti v praksi niso pomembna, saj del našega CSS-ja, ki ni vdor, v celoti preveri veljavnost in deli, ki so vdori, ne motijo pravilnega delovanja dela, ki ni vdor, zato namenoma ignoriramo ta posebna opozorila.
Naši dokumenti HTML prav tako vsebujejo nekaj trivialnih in nepomembnih opozoril o preverjanju veljavnosti HTML, ker smo vključili rešitev za določeno napako Firefoxa .