Source

Mga browser ug device

Pagkat-on bahin sa mga browser ug mga aparato, gikan sa moderno hangtod sa karaan, nga gisuportahan sa Bootstrap, lakip ang nahibal-an nga mga quirks ug mga bug alang sa matag usa.

Gisuportahan nga mga browser

Gisuportahan sa Bootstrap ang pinakabag-o, stable nga pagpagawas sa tanang dagkong browser ug platform. Sa Windows, gisuportahan namo ang Internet Explorer 10-11 / Microsoft Edge .

Ang mga alternatibong browser nga naggamit sa pinakabag-o nga bersyon sa WebKit, Blink, o Gecko, direkta man o pinaagi sa web view API sa plataporma, dili klarong gisuportahan. Bisan pa, ang Bootstrap kinahanglan (sa kadaghanan nga mga kaso) magpakita ug molihok sa husto sa kini nga mga browser usab. Ang mas espesipikong impormasyon sa suporta gihatag sa ubos.

Imong makita ang among gisuportahan nga han-ay sa mga browser ug ang ilang mga bersyon sa amongpackage.json :

"browserslist": [
  "last 1 major version",
  ">= 1%",
  "Chrome >= 45",
  "Firefox >= 38",
  "Edge >= 12",
  "Explorer >= 10",
  "iOS >= 9",
  "Safari >= 9",
  "Android >= 4.4",
  "Opera >= 30"
]

Gigamit namo ang Autoprefixer aron pagdumala sa gituyo nga suporta sa browser pinaagi sa mga prefix sa CSS, nga naggamit sa Browserslist aron pagdumala niini nga mga bersyon sa browser. Konsultaha ang ilang dokumentasyon kung giunsa pag-integrate kini nga mga himan sa imong mga proyekto.

Mga mobile device

Sa kinatibuk-an, ang Bootstrap nagsuporta sa pinakabag-o nga mga bersyon sa matag mayor nga plataporma nga default browsers. Timan-i nga ang mga proxy browser (sama sa Opera Mini, Opera Mobile's Turbo mode, UC Browser Mini, Amazon Silk) wala gisuportahan.

Chrome Firefox Safari Android Browser ug WebView Microsoft Edge
Android Gisuportahan Gisuportahan N/A Android v5.0+ gisuportahan Gisuportahan
iOS Gisuportahan Gisuportahan Gisuportahan N/A Gisuportahan
Windows 10 Mobile N/A N/A N/A N/A Gisuportahan

Mga browser sa desktop

Sa susama, ang pinakabag-o nga bersyon sa kadaghanan sa mga desktop browser gisuportahan.

Chrome Firefox Internet Explorer Microsoft Edge Opera Safari
Mac Gisuportahan Gisuportahan N/A N/A Gisuportahan Gisuportahan
Windows Gisuportahan Gisuportahan Gisuportahan, IE10+ Gisuportahan Gisuportahan Wala gisuportahan

Alang sa Firefox, dugang sa pinakabag-o nga normal nga stable nga pagpagawas, gisuportahan usab namo ang pinakabag-o nga Extended Support Release (ESR) nga bersyon sa Firefox.

Sa dili opisyal nga paagi, ang Bootstrap kinahanglan nga tan-awon ug molihok nga maayo sa Chromium ug Chrome alang sa Linux, Firefox alang sa Linux, ug Internet Explorer 9, bisan kung dili kini opisyal nga suportado.

Para sa lista sa pipila sa mga browser bugs nga kinahanglang sagubangon ni Bootstrap, tan-awa ang among Wall of browser bugs .

Internet Explorer

Gisuportahan ang Internet Explorer 10+; IE9 ug paubos dili. Palihug hibaloi nga ang pipila ka CSS3 nga mga kabtangan ug HTML5 nga mga elemento dili hingpit nga gisuportahan sa IE10, o nanginahanglan ug prefix nga mga kabtangan alang sa hingpit nga pagpaandar. Bisitaha ang Magamit ba nako… para sa mga detalye sa suporta sa browser sa CSS3 ug HTML5 nga mga bahin.

Kung kinahanglan nimo ang suporta sa IE8-9, gamita ang Bootstrap 3. Kini ang labing lig-on nga bersyon sa among code ug gisuportahan gihapon sa among team alang sa mga kritikal nga pag-ayo sa bug ug mga pagbag-o sa dokumentasyon. Bisan pa, wala’y bag-ong mga bahin nga idugang niini.

Mga modal ug dropdown sa mobile

Pag-awas ug pag-scroll

Ang suporta alang overflow: hidden;sa <body>elemento limitado sa iOS ug Android. Sa kana nga katuyoan, kung mag-scroll ka sa ibabaw o sa ilawom sa usa ka modal sa bisan hain sa mga browser sa mga aparato, ang <body>sulud magsugod sa pag-scroll. Tan-awa ang Chrome bug #175502 (naayo sa Chrome v40) ug WebKit bug #153852 .

Mga natad sa teksto sa iOS ug pag-scroll

Ingon sa iOS 9.2, samtang ang usa ka modal bukas, kung ang inisyal nga paghikap sa usa ka scroll gesture naa sa sulud sa usa ka textual <input>o usa ka <textarea>, ang sulud sa <body>ilawom sa modal ang i-scroll imbes sa modal mismo. Tan-awa ang WebKit bug #153856 .

Ang .dropdown-backdropelemento wala gigamit sa iOS sa nav tungod sa pagkakomplikado sa z-indexing. Busa, aron masira ang mga dropdown sa mga navbar, kinahanglan nimo nga direktang i-klik ang dropdown nga elemento (o bisan unsang elemento nga mopabuto sa usa ka click nga panghitabo sa iOS ).

Pag-zoom sa browser

Ang pag-zoom sa panid dili kalikayan nga nagpresentar sa mga artifact sa paghubad sa pipila ka mga sangkap, pareho sa Bootstrap ug sa ubang bahin sa web. Depende sa isyu, mahimo natong ayuhon kini (pangitaa una ug dayon ablihi ang isyu kung gikinahanglan). Bisan pa, kanunay namon nga ibaliwala kini tungod kay kanunay sila wala’y direkta nga solusyon gawas sa mga hacky nga workaround.

Sticky :hover/ :focussa iOS

Bisan :hoverkung dili mahimo sa kadaghanan nga mga aparato sa paghikap, gisundog sa iOS kini nga pamatasan, nga nagresulta sa "sticky" nga mga istilo sa hover nga nagpadayon pagkahuman sa pag-tap sa usa ka elemento. Kini nga mga estilo sa hover matangtang lamang kung ang mga tiggamit mag-tap sa laing elemento. Kini nga pamatasan gikonsiderar nga dili gusto ug ingon og dili usa ka isyu sa mga aparato sa Android o Windows.

Sa tibuok namong v4 alpha ug beta releases, among gilakip ang dili kompleto ug nagkomento sa code para sa pagpili sa usa ka media query shim nga mag-disable sa mga estilo sa hover sa touch device browsers nga nagsunod sa hovering. Kini nga trabaho wala gayud hingpit nga nahuman o nahimo, apan aron malikayan ang hingpit nga pagkaguba, among gipili nga isalikway kini nga shim ug itago ang mga mixin isip mga shortcut alang sa mga pseudo-classes.

Pag-imprinta

Bisan sa pipila ka modernong mga browser, ang pag-imprenta mahimong talagsaon.

Sama sa Safari v8.0, ang paggamit sa fixed-width .containernga klase mahimong hinungdan sa Safari sa paggamit sa usa ka talagsaon nga gamay nga gidak-on sa font sa pag-imprinta. Tan-awa ang isyu #14868 ug WebKit bug #138192 alang sa dugang mga detalye. Usa ka potensyal nga workaround mao ang mosunod nga CSS:

@media print {
  .container {
    width: auto;
  }
}

Android stock browser

Sa gawas sa kahon, ang Android 4.1 (ug bisan ang pipila nga mas bag-o nga mga pagpagawas dayag) gipadala uban ang Browser app isip default nga web browser nga gipili (sukwahi sa Chrome). Ikasubo, ang Browser app adunay daghang mga bug ug mga pagkasumpaki sa CSS sa kinatibuk-an.

Pilia ang menu

Sa <select>mga elemento, ang Android stock browser dili magpakita sa mga kontrol sa kilid kung adunay border-radiusug/o bordergipadapat. (Tan-awa kini nga pangutana sa StackOverflow alang sa mga detalye.) Gamita ang snippet sa code sa ubos aron tangtangon ang nakasala nga CSS ug i-render ang <select>ingon nga unstyled nga elemento sa Android stock browser. Ang user agent nga nag-sniff naglikay sa pagpanghilabot sa mga browser sa Chrome, Safari, ug 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>

Gusto nga makakita og usa ka pananglitan? Tan-awa kini nga JS Bin demo.

Mga validator

Aron mahatagan ang labing kaayo nga posible nga kasinatian sa mga daan ug buggy browser, ang Bootstrap naggamit sa CSS browser hacks sa daghang mga lugar aron ma-target ang espesyal nga CSS sa pipila nga mga bersyon sa browser aron masulbad ang mga bug sa mga browser mismo. Kini nga mga hack masabtan nga hinungdan nga ang mga validator sa CSS magreklamo nga sila dili balido. Sa usa ka magtiayon nga mga lugar, migamit usab kami sa nagdugo nga mga bahin sa CSS nga dili pa hingpit nga na-standardize, apan kini gigamit lamang alang sa progresibong pagpauswag.

Kini nga mga pasidaan sa pag-validate dili igsapayan sa praktis tungod kay ang dili-hacky nga bahin sa among CSS hingpit nga nag-validate ug ang mga hacky nga mga bahin dili makabalda sa husto nga paglihok sa dili-hacky nga bahin, busa ngano nga kami tinuyo nga wala magtagad sa kini nga mga partikular nga pasidaan.

Ang among HTML docs usab adunay pipila ka walay hinungdan ug walay hinungdan nga HTML validation nga mga pasidaan tungod sa among paglakip sa usa ka solusyon alang sa usa ka bug sa Firefox .