Dagiti browser ken alikamen
Ammuem ti maipapan kadagiti browser ken alikamen, manipud moderno agingga iti daan, a suportado ti Bootstrap, agraman dagiti pagaammo a quirk ken bug para iti tunggal maysa.
Dagiti nasuportaran a browser
Suportaran ti Bootstrap dagiti kaudian, natalged a pannakairuar dagiti amin a kangrunaan a browser ken plataporma. Iti Windows, suportaranmi ti Internet Explorer 10-11 / Microsoft Edge .
Dagiti alternatibo a browser nga agus-usar ti kaudian a bersion ti WebKit, Blink, wenno Gecko, direkta man wenno babaen ti web view API ti plataporma, ket saan a nalawag a nasuportaran. Nupay kasta, ti Bootstrap ket rumbeng (iti kaaduan a kaso) nga umiso ti ipakita ken panagandar kadagitoy a browser pay. Ad-adu nga espesipiko nga impormasion ti suporta ti naited iti baba.
Mabalinmo a sapulen dagiti nasuportaran a sakop dagiti browsermi ken dagiti bersionda iti.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
Usarenmi ti Autoprefixer tapno mangasikaso iti nairanta a suporta ti browser babaen kadagiti prefix ti CSS, nga agus-usar iti Browserslist tapno mangituray kadagitoy a bersion ti browser. Konsultaen ti dokumentasionda no kasano nga isilpo dagitoy nga alikamen kadagiti proyektom.
Dagiti mobile nga alikamen
Iti sapasap a panagsao, ti Bootstrap ket mangsuporta kadagiti kaudian a bersion ti tunggal maysa a nangruna a plataporma dagiti default a browser. Imutektekanyo a dagiti proxy a browser (kas ti Opera Mini, Turbo a kasasaad ti Opera Mobile, UC Browser Mini, Amazon Silk) ket saan a nasuportaran.
| Chrome nga | Firefox nga | Safari nga | Browser ti Android & Panangkita iti Web | Microsoft nga Edge | |
|---|---|---|---|---|---|
| Android nga | Nasuportaran | Nasuportaran | N/A nga | Android v5.0+ nga suportado | Nasuportaran |
| iOS nga | Nasuportaran | Nasuportaran | Nasuportaran | N/A nga | Nasuportaran |
| Windows 10 nga Mobile | N/A nga | N/A nga | N/A nga | N/A nga | Nasuportaran |
Dagiti browser iti desktop
Kasta met, dagiti kaudian a bersion ti kaaduan a desktop browser ket nasuportaran.
| Chrome nga | Firefox nga | Internet nga Eksplorador | Microsoft nga Edge | Opera nga | Safari nga | |
|---|---|---|---|---|---|---|
| Mac ni Mac | Nasuportaran | Nasuportaran | N/A nga | Nasuportaran | Nasuportaran | Nasuportaran |
| Dagiti tawa | Nasuportaran | Nasuportaran | Nasuportaran, IE10+ | Nasuportaran | Nasuportaran | Saan a nasuportaran |
Para iti Firefox, malaksid iti kaudian a normal a natalinaay a pannakairuar, suportaranmi pay ti kaudian a bersion ti Extended Support Release (ESR) ti Firefox.
Iti saan nga opisial, ti Bootstrap ket rumbeng nga umdas ti panagkita ken panagtignayna iti Chromium ken Chrome para iti Linux, Firefox para iti Linux, ken Internet Explorer 9, urayno dagitoy ket saan nga opisial a nasuportaran.
Para iti listaan ti sumagmamano kadagiti bug ti browser a masapul a makiranget ti Bootstrap, kitaen ti Padermi kadagiti bug ti browser .
Internet nga Eksplorador
Nasuportaran ti Internet Explorer 10+; IE9 ken agpababa ti saan. Pangngaasi nga ammom a dagiti sumagmamano a tagikua ti CSS3 ken dagiti elemento ti HTML5 ket saan a naan-anay a nasuportaran iti IE10, wenno agkasapulan kadagiti nasakbay a tagikua para iti naan-anay a panagusar. Bisitaen Mabalin kadi nga usaren... para kadagiti detalye ti suporta ti browser kadagiti tampok ti CSS3 ken HTML5. No kasapulam ti suporta ti IE8-9, usarem ti Bootstrap 3.
Modal ken dropdown iti mobile
Overflow ken panag-scroll
Ti suporta para overflow: hidden;iti on the <body>element ket medyo limitado iti iOS ken Android. Tapno maaramid dayta, no ag-scroll-ka a lumabas iti ngato wenno baba ti maysa a modal iti asinoman kadagita a browser dagita nga alikamen, <body>mangrugin nga ag-scroll ti linaonna. Kitaen ti bug ti Chrome #175502 (natarimaan iti Chrome v40) ken ti bug ti WebKit #153852 .
iOS text fields ken panag-scroll
Manipud iti iOS 9.2, bayat a ti maysa a modal ket silulukat, no ti damo a panagsagid ti maysa a panagtignay ti lukot ket adda iti uneg ti beddeng ti maysa a tekstual <input>wenno a <textarea>, ti <body>linaon iti baba ti modal ket mai-scrollto imbes a ti modal a mismo. Kitaen ti bug ti WebKit #153856 .
Dagiti Panag-dropdown ti Navbar
Ti .dropdown-backdropelemento ket saan a maus-usar iti iOS iti nav gapu ti kinarikut ti z-indexing. Gapuna, tapno maiserra dagiti dropdown kadagiti navbar, masapul a direkta nga i-klikmo ti dropdown nga elemento (wenno ania man a sabali nga elemento a mangpaputok iti pasamak ti panag-click iti iOS ).
Panag-zoom ti browser
Ti panag-zoom ti panid ket saan a maliklikan a mangipresenta kadagiti artifact ti panagiparang kadagiti sumagmamano a paset, agpadpada iti Bootstrap ken ti nabati a paset ti web. Depende iti isyu, mabalin a matarimaantayo dayta (agsapul nga umuna ket kalpasanna luktantayo ti isyu no kasapulan). Nupay kasta, agannayastayo a di ikankano dagitoy ta masansan nga awan ti direkta a solusionda malaksid kadagiti hacky a panagliklik.
Napigket :hover/ :focusiti iOS
Nupay :hoversaan a posible iti kaaduan a touch device, tuladen ti iOS daytoy a kababalin, a mangibunga kadagiti “napigket” nga estilo ti hover nga agtalinaed kalpasan ti panangi-tap iti maysa nga elemento. Dagitoy nga estilo ti hover ket maikkat laeng no dagiti agar-aramat ket ag-tap ti sabali nga elemento. Daytoy a kababalin ket maibilang a kaaduan a saan a matarigagayan ken agparang a saan nga isyu kadagiti Android wenno Windows nga alikamen.
Iti intero a v4 alpha ken beta a nairuarmi, inramanmi ti saan a kompleto ken nagkomento a kodigo para iti panagpili iti media query shim a mangbaldado kadagiti estilo ti hover kadagiti touch device browser a mangtulad iti hovering. Daytoy nga obra ket saan a pulos a naan-anay a nalpasen wenno napalubosan, ngem tapno maliklikan ti naan-anay a pannakaburak, pinilim a deprecate daytoy a shim ken pagtalinaeden dagiti mixin a kas dagiti ab-ababa a dalan para kadagiti pseudo-klase.
Panagimprenta
Uray iti dadduma a moderno a browser, mabalin a quirky ti panagimprenta.
Manipud iti Safari v8.0, ti panagusar ti klase ti naikeddeng-kalawa .containerket mabalin a mangpataud ti Safari nga agusar ti naisangsangayan a bassit a kadakkel ti letra no agimprenta. Kitaen ti isyu #14868 ken WebKit bug #138192 para kadagiti ad-adu pay a detalye. Maysa a potensial a panagliklik ket ti sumaganad a CSS:
@media print {
.container {
width: auto;
}
}
Android nga stock nga browser
Iti ruar ti kahon, ti Android 4.1 (ken uray pay ti dadduma a baro a nairuar agparang) ket maipatulod a kadua ti Browser app kas ti default a web browser a pagpilian (kas maisupadi iti Chrome). Daksanggasat ta adu ti bug ken di panagtutunos ti Browser app iti CSS iti pangkaaduan.
Pilien ti menu
Kadagiti <select>elemento, ti Android stock browser ket saan a mangiparang kadagiti kontrol ti sikigan no adda border-radiusken/wenno bordernaipakat. (Kitaen daytoy a saludsod ti StackOverflow para kadagiti detalye.) Usaren ti snippet ti kodigo iti baba tapno ikkaten ti makasair a CSS ken iparang ti <select>kas saan nga estilo nga elemento iti Android stock browser. Ti panaganges ti ahente ti agar-aramat ket mangliklik iti pannakasinga kadagiti Chrome, Safari, ken Mozilla a browser.
<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>
Kayatmo kadi ti makakita iti pagarigan? Kitaen daytoy a demo ti JS Bin .
Dagiti Validator
Tapno mangipaay ti kasayaatan a mabalin a padas kadagiti daan ken buggy a browser, ti Bootstrap ket agus-usar kadagiti CSS a browser hack kadagiti sumagmamano a lugar tapno mangpuntiria ti espesial a CSS kadagiti sumagmamano a bersion ti browser tapno agtrabaho iti aglawlaw dagiti bug kadagiti browser a mismo. Dagitoy a hack ket maawatan a pakaigapuan ti panagreklamo dagiti CSS validator a saan nga imbalido dagitoy. Iti agassawa a lugar, agus-usarkami pay kadagiti bleeding-edge a tampok ti CSS a saan pay a naan-anay a naistandard, ngem dagitoy ket naus-usar a puro para iti progresibo a panagpasayaat.
Dagitoy a pakdaar ti panangipaneknek ket saan a napateg iti praktis gapu ta ti saan a hacky a paset ti CSS-tayo ket naan-anay a mangbalido ken dagiti hacky a paset ket saan a mangsinga iti umno a panagandar ti saan a hacky a paset, gapuna no apay nga inggagaratayo a di ikankano dagitoy a partikular a pakdaar.
Dagiti dokumentomi ti HTML ket addaan met kadagiti sumagmamano a saan a napateg ken saan a napateg a pakdaar ti panangipaneknek ti HTML gapu ti pannakairamanmi ti maysa a panagliklik para iti maysa a naikeddeng a bug ti Firefox .