Brabhsálaithe agus gléasanna
Foghlaim faoi na brabhsálaithe agus na gléasanna, ó nua-aimseartha go sean, a fhaigheann tacaíocht ó Bootstrap, lena n-áirítear cuairicí agus fabhtanna aitheanta do gach ceann acu.
Brabhsálaithe tacaithe
Tacaíonn Bootstrap leis na heisiúintí cobhsaí is déanaí de gach mórbhrabhsálaí agus ardáin. Ar Windows, tacaímid le Internet Explorer 10-11 / Microsoft Edge .
Ní thacaítear go sainráite le brabhsálaithe eile a úsáideann an leagan is déanaí de WebKit, Blink, nó Gecko, cibé acu go díreach nó trí API amharc gréasáin an ardáin. Mar sin féin, ba cheart do Bootstrap (i bhformhór na gcásanna) taispeáint agus feidhmiú i gceart sna brabhsálaithe seo freisin. Soláthraítear faisnéis tacaíochta níos sainiúla thíos.
Is féidir leat ár raon brabhsálaithe tacaithe agus a leaganacha a fháil inár.browserslistrc file
n- :
# 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
Bainimid úsáid as Autoprefixer chun tacaíocht do bhrabhsálaí atá beartaithe a láimhseáil trí réimíreanna CSS, a úsáideann Browserslist chun na leaganacha brabhsálaí seo a bhainistiú. Féach ar a gcuid doiciméad le haghaidh conas na huirlisí seo a chomhtháthú le do thionscadail.
Gléasanna soghluaiste
Go ginearálta, tacaíonn Bootstrap leis na leaganacha is déanaí de bhrabhsálaithe réamhshocraithe gach ardáin mhóra. Tabhair faoi deara nach dtugtar tacaíocht do bhrabhsálaithe seachfhreastalaí (cosúil le Opera Mini, modh Turbo Opera Mobile, UC Browser Mini, Amazon Silk).
Chrome | Firefox | Safari | Brabhsálaí Android & WebView | Microsoft Edge | |
---|---|---|---|---|---|
Android | Tacaithe | Tacaithe | N / A | Tacaítear le Android v5.0+ | Tacaithe |
iOS | Tacaithe | Tacaithe | Tacaithe | N / A | Tacaithe |
Windows 10 soghluaiste | N / A | N / A | N / A | N / A | Tacaithe |
Brabhsálaithe deisce
Mar an gcéanna, tacaítear leis na leaganacha is déanaí den chuid is mó de na brabhsálaithe deisce.
Chrome | Firefox | Internet Explorer | Microsoft Edge | Opera | Safari | |
---|---|---|---|---|---|---|
Mac | Tacaithe | Tacaithe | N / A | Tacaithe | Tacaithe | Tacaithe |
Windows | Tacaithe | Tacaithe | Tacaithe, IE10+ | Tacaithe | Tacaithe | Gan tacaíocht |
I gcás Firefox, chomh maith leis an ngnáthscaoileadh cobhsaí is déanaí, tacaímid freisin leis an leagan is déanaí den Eisiúint Tacaíochta Leathnaithe (ESR) de Firefox.
Go neamhoifigiúil, ba cheart do Bootstrap breathnú agus iompar sách maith i gCróimiam agus Chrome le haghaidh Linux, Firefox le haghaidh Linux, agus Internet Explorer 9, cé nach bhfuil tacaíocht oifigiúil acu.
Le haghaidh liosta de chuid de na fabhtanna brabhsálaí a gcaithfidh Bootstrap dul i ngleic leo, féach ar ár Wall of browser bugs .
Internet Explorer
tacaítear le Internet Explorer 10+; Níl IE9 agus síos. Tabhair faoi deara le do thoil nach dtacaítear go hiomlán le roinnt airíonna CSS3 agus eilimintí HTML5 in IE10, nó go dteastaíonn airíonna réamhshocruithe le haghaidh feidhmiúlacht iomlán. Tabhair cuairt ar An féidir liom úsáid a bhaint as… le haghaidh sonraí maidir le tacaíocht brabhsálaí do ghnéithe CSS3 agus HTML5. Má theastaíonn tacaíocht IE8-9 uait, bain úsáid as Bootstrap 3.
Modhanna agus anuas ar soghluaiste
Cur thar maoil agus scrollaigh
Tá tacaíocht don overflow: hidden;
eilimint <body>
teoranta go leor i iOS agus Android. Chuige sin, nuair a scrollaíonn tú thar barr nó bun modha i gceachtar de na brabhsálaithe gléasanna sin, <body>
tosóidh an t-ábhar ag scrollú. Féach fabht Chrome #175502 (seasta in Chrome v40) agus fabht WebKit #153852 .
réimsí téacs iOS agus scrollaigh
Amhail iOS 9.2, cé go bhfuil modúl oscailte, má tá teagmháil tosaigh gotha scrollaithe laistigh de theorainn téacsúil <input>
nó <textarea>
, déanfar an t- <body>
ábhar faoin modh a scrollú in ionad an mhódúil féin. Féach ar fhabht WebKit #153856 .
Navbar dropdowns
Ní .dropdown-backdrop
úsáidtear an eilimint ar iOS sa nav mar gheall ar chastacht an innéacsaithe z. Mar sin, chun anuas a dhúnadh sna barraí nascleanúna, ní mór duit an eilimint anuas a chliceáil go díreach (nó ar aon eilimint eile a chuirfeadh imeacht cliceáil ar iOS ).
Brabhsálaí ag súmáil
Tá sé dosheachanta go dtugann súmáil leathanaigh déantáin rindreála i roinnt comhpháirteanna, i Bootstrap agus sa chuid eile den ngréasán. Ag brath ar an tsaincheist, seans go mbeimid in ann í a réiteach (cuardaigh ar dtús agus ansin ceist a oscailt más gá). Mar sin féin, is gnách linn neamhaird a dhéanamh orthu seo mar is minic nach mbíonn aon réiteach díreach acu seachas réitigh sheacanta.
Greamaitheach :hover
/ :focus
ar iOS
Cé :hover
nach féidir é a dhéanamh ar fhormhór na ngléasanna tadhaill, déanann iOS aithris ar an iompar seo, agus mar thoradh air sin bíonn stíleanna “greamaitheacha” hover a leanann tar éis gné amháin a thapáil. Ní bhaintear na stíleanna hover seo ach amháin nuair a thapaíonn úsáideoirí eilimint eile. Meastar go bhfuil an iompar seo neamh-inmhianaithe den chuid is mó agus is cosúil nach fadhb é ar ghléasanna Android nó Windows.
Le linn ár n-eisiúintí v4 alfa agus béite, chuireamar cód neamhiomlán san áireamh agus rinneamar trácht ar rogha an diúltaithe i gceist le ceist meáin a dhíchumasódh stíleanna hover i mbrabhsálaithe gléasanna tadhaill a dhéanann aithris ar hovering. Níor críochnaíodh nó níor cumasaíodh an obair seo go hiomlán, ach chun briseadh iomlán a sheachaint, roghnaigh muid an shim seo a dhímheas agus na meascáin a choinneáil mar aicearraí do na pseudo-ranganna.
Priontáil
Fiú i roinnt brabhsálaithe nua-aimseartha, is féidir le priontáil a bheith neamhghnách.
Amhail Safari v8.0, d’fhéadfadh úsáid an ranga leithead seasta .container
a chur faoi deara go n-úsáidfidh Safari clómhéid neamhghnách beag agus é ag priontáil. Féach eagrán #14868 agus WebKit fabht #138192 le haghaidh tuilleadh sonraí. Réiteach féideartha amháin is ea an CSS seo a leanas:
@media print {
.container {
width: auto;
}
}
Brabhsálaí stoc Android
Amach as an mbosca, seoltar Android 4.1 (agus fiú roinnt eisiúintí níos nuaí de réir dealraimh) leis an aip Brabhsálaí mar an brabhsálaí gréasáin réamhshocraithe de rogha (seachas Chrome). Ar an drochuair, tá go leor fabhtanna agus neamhréireachtaí ag an app Brabhsálaí le CSS i gcoitinne.
Roghnaigh roghchlár
Maidir <select>
le heilimintí, ní thaispeánfaidh brabhsálaí stoc Android na taobhrialtáin má tá a border-radius
agus/nó border
curtha i bhfeidhm. (Féach ar an gceist StackOverflow seo le haghaidh sonraí.) Bain úsáid as an mblúire de chód thíos chun an CSS ciontach a bhaint agus é a dhéanamh <select>
mar eilimint gan stíl ar stocbhrabhsálaí Android. Seachnaíonn sniffing an ghníomhaire úsáideora cur isteach ar bhrabhsálaithe Chrome, Safari agus 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>
Ar mhaith leat sampla a fheiceáil? Amharc ar an taispeántas JS Bin seo .
Bailitheoirí
In order to provide the best possible experience to old and buggy browsers, Bootstrap uses CSS browser hacks in several places to target special CSS to certain browser versions in order to work around bugs in the browsers themselves. These hacks understandably cause CSS validators to complain that they are invalid. In a couple places, we also use bleeding-edge CSS features that aren’t yet fully standardized, but these are used purely for progressive enhancement.
These validation warnings don’t matter in practice since the non-hacky portion of our CSS does fully validate and the hacky portions don’t interfere with the proper functioning of the non-hacky portion, hence why we deliberately ignore these particular warnings.
Tá roinnt rabhaidh bailíochtaithe HTML fánach agus neamhleanúnacha ag ár ndoiciméid HTML mar gheall ar ár gcuimsiú d'fhabht oibre le haghaidh fabht Firefox áirithe .