I navigatori è i dispositi
Amparate nantu à i navigatori è i dispositi, da i muderni à i vechji, chì sò supportati da Bootstrap, cumpresi capricci è bug cunnisciuti per ognunu.
Navigatori supportati
Bootstrap supporta l' ultime versioni stabili di tutti i principali navigatori è piattaforme. In Windows, supportemu Internet Explorer 10-11 / Microsoft Edge .
I navigatori alternativi chì utilizanu l'ultima versione di WebKit, Blink, o Gecko, sia direttamente sia via l'API di vista web di a piattaforma, ùn sò micca supportati esplicitamente. Tuttavia, Bootstrap duveria (in a maiò parte di i casi) affissà è funziona bè in questi navigatori. Più infurmazione specifica di supportu hè furnita quì sottu.
Pudete truvà a nostra gamma di navigatori supportati è e so versioni in i nostri.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
Utilizemu l' Autoprefixer per trattà u supportu di u navigatore previstu via prefissi CSS, chì usa Browserslist per gestisce queste versioni di u navigatore. Cunsultate a so documentazione per cumu integrà sti strumenti in i vostri prughjetti.
Dispositivi mobile
In generale, Bootstrap supporta l'ultime versioni di i navigatori predeterminati di ogni piattaforma maiò. Nota chì i navigatori proxy (cum'è Opera Mini, u modu Turbo di Opera Mobile, UC Browser Mini, Amazon Silk) ùn sò micca supportati.
| Chrome | Firefox | Safari | Navigatore Android è WebView | Microsoft Edge | |
|---|---|---|---|---|---|
| Android | Supportatu | Supportatu | N/A | Android v5.0+ supportatu | Supportatu |
| iOS | Supportatu | Supportatu | Supportatu | N/A | Supportatu |
| Windows 10 Mobile | N/A | N/A | N/A | N/A | Supportatu |
I navigatori desktop
In listessu modu, l'ultime versioni di a maiò parte di i navigatori desktop sò supportati.
| Chrome | Firefox | Internet Explorer | Microsoft Edge | Opera | Safari | |
|---|---|---|---|---|---|---|
| Mac | Supportatu | Supportatu | N/A | Supportatu | Supportatu | Supportatu |
| Windows | Supportatu | Supportatu | Supportatu, IE10+ | Supportatu | Supportatu | Ùn hè micca supportatu |
Per Firefox, in più di l'ultima versione stabile normale, supportemu ancu l'ultima versione di l' Extended Support Release (ESR) di Firefox.
Unofficialmente, Bootstrap deve vede è cumportanu abbastanza bè in Chromium è Chrome per Linux, Firefox per Linux è Internet Explorer 9, ancu s'ellu ùn sò micca supportati ufficialmente.
Per una lista di alcuni di i bug di u navigatore chì Bootstrap hà da affruntà, vede u nostru Muru di bug di navigatore .
Internet Explorer
Internet Explorer 10+ hè supportatu; IE9 è giù ùn hè micca. Per piacè esse cuscenti chì alcune proprietà CSS3 è elementi HTML5 ùn sò micca cumpletamente supportati in IE10, o necessitanu proprietà prefissate per a funziunalità cumpleta. Visita Possu aduprà ... per i dettagli nantu à u supportu di u navigatore di e funzioni CSS3 è HTML5. Sè avete bisognu di supportu IE8-9, utilizate Bootstrap 3.
Modali è dropdowns nantu à u telefuninu
Overflow è scrolling
U supportu per overflow: hidden;l' <body>elementu hè abbastanza limitatu in iOS è Android. À questu scopu, quandu scorri u cima o u fondu di un modale in unu di i navigatori di quelli dispositi, u <body>cuntenutu cumincià à scroll. Vede u bug Chrome #175502 (fissatu in Chrome v40) è u bug WebKit #153852 .
Campi di testu iOS è scrolling
Da iOS 9.2, mentre chì un modale hè apertu, se u toccu iniziale di un gestu di scroll hè in u cunfini di un testu <input>o un <textarea>, u <body>cuntenutu sottu à u modale serà scrollatu invece di u modale stessu. Vede u bug di WebKit #153856 .
Navbar Dropdowns
L' .dropdown-backdropelementu ùn hè micca usatu in iOS in u navigatore per via di a cumplessità di z-indexing. Cusì, per chjude dropdowns in navbars, duvete cliccà direttamente l'elementu dropdown (o qualsiasi altru elementu chì spararà un avvenimentu di clic in iOS ).
Zoom di u navigatore
U zoom di pagina presenta inevitabilmente artefatti di rendering in certi cumpunenti, sia in Bootstrap sia in u restu di u web. Sicondu u prublema, pudemu esse capace di riparà (cercà prima è dopu apre un prublema s'ellu hè necessariu). Tuttavia, tendemu à ignurà questi perchè spessu ùn anu micca solu suluzione diretta altru ch'è solu solu solu.
Sticky :hover/ :focusnantu à iOS
Mentre :hoverùn hè micca pussibule nantu à a maiò parte di i dispositi touch, iOS emula stu cumpurtamentu, risultatu in stili di hover "sticky" chì persiste dopu à toccu un elementu. Questi stili di hover sò eliminati solu quandu l'utilizatori toccanu un altru elementu. Stu cumpurtamentu hè cunsideratu largamente indesevule è pare micca esse un prublema in i dispositi Android o Windows.
In tutte e nostre versioni alfa è beta v4, avemu inclusu un codice incompletu è cummentatu per optà per un shim di media query chì disattiveghja i stili di hover in i navigatori di u dispositivu touch chì emula l'hovering. Stu travagliu ùn hè mai statu cumplettamente cumpletu o attivatu, ma per evità a rottura cumpleta, avemu optatu per deprecate stu shim è mantene i mixin cum'è accurtatoghji per i pseudo-classi.
Stampa
Ancu in certi navigatori muderni, a stampa pò esse stravagante.
A partire da Safari v8.0, l'usu di a .containerclassa di larghezza fissa pò causà Safari à utilizà una dimensione di font inusualmente chjuca quandu stampa. Vede u prublema #14868 è u bug WebKit #138192 per più dettagli. Una soluzione potenziale hè u CSS seguente:
@media print {
.container {
width: auto;
}
}
navigatore stock Android
Fora di a scatula, Android 4.1 (è ancu alcune versioni più recenti apparentemente) spedite cù l'app Browser cum'è u navigatore web predeterminatu di scelta (in uppusizione à Chrome). Sfortunatamente, l'app Browser hà assai bug è inconsistenzi cù CSS in generale.
Selezziunà menu
Nantu à <select>elementi, u navigatore stock Android ùn vi mostra i cuntrolli latu s'ellu ci hè un border-radiusè / o borderappiicata. (Vede sta quistione di StackOverflow per i dettagli.) Aduprate u snippet di codice sottu per sguassà u CSS offensiu è rende u <select>cum'è un elementu senza stile in u navigatore di stock Android. L'agente di l'utente sniffing evita l'interferenza cù i navigatori Chrome, Safari è 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>
Vulete vede un esempiu? Scuprite sta demo di JS Bin .
Validatori
Per furnisce a megliu sperienza pussibule à i navigatori vechji è buggy, Bootstrap usa i pirate di u navigatore CSS in parechji posti per indirizzà CSS speciale à certe versioni di u navigatore per trattà i bug in i navigatori stessi. Questi pirate sò capiscenu chì i validatori CSS si lamentanu ch'elli ùn sò micca validi. In un coppiu di lochi, avemu ancu aduprà funzioni CSS di punta chì ùn sò micca ancora cumplettamente standardizati, ma sò aduprate solu per a migliione progressiva.
Questi avvisi di validazione ùn importanu micca in pratica, postu chì a parte non-hacky di u nostru CSS cunvalida cumplettamente è e porzioni pirate ùn interferiscenu micca cù u funziunamentu propiu di a parte non-hacky, per quessa chì ignoremu deliberatamente questi avvisi particulari.
I nostri documenti HTML anu ancu alcuni avvisi di validazione HTML triviali è inconsequenziali per via di a nostra inclusione di una soluzione per un certu bug di Firefox .