Ag tosú
Forbhreathnú ar Bootstrap, conas a íoslódáil agus a úsáid, teimpléid bhunúsacha agus samplaí, agus go leor eile.
Forbhreathnú ar Bootstrap, conas a íoslódáil agus a úsáid, teimpléid bhunúsacha agus samplaí, agus go leor eile.
Tá roinnt bealaí éasca ag Bootstrap (v3.3.7 faoi láthair) chun tús a chur go tapa leis, gach ceann acu tarraingteach do chás leibhéil agus úsáide éagsúla. Léigh tríd chun féachaint cad a oireann do do riachtanais ar leith.
CSS, JavaScript, agus clónna tiomsaithe agus mionghearrtha. Níl aon doiciméid nó comhaid foinse bunaidh san áireamh.
Foinse Lúide, JavaScript, agus comhaid chló, chomh maith lenár ndoiciméid. Teastaíonn tiomsaitheoir níos lú agus roinnt thus.
Aistrítear Bootstrap ó Lúide go Sass chun é a áireamh go héasca i dtionscadail Rails, Compass, nó Sass-amháin.
Tugann na daoine thall ag jsDelivr tacaíocht CDN do CSS agus JavaScript Bootstrap. Bain úsáid as na naisc CDN Bootstrap seo.
Is féidir leat freisin Bootstrap's Less, CSS, JavaScript, agus clónna a shuiteáil agus a bhainistiú ag baint úsáide as Bower :
Is féidir leat Bootstrap a shuiteáil freisin ag baint úsáide as npm :
require('bootstrap')
luchtófar gach breiseán jQuery de chuid Bootstrap ar an réad jQuery. Ní bootstrap
onnmhairíonn an modúl féin rud ar bith. Is féidir leat breiseán jQuery Bootstrap a luchtú de láimh ina n-aonar trí na /js/*.js
comhaid a lódáil faoi eolaire barrleibhéil an phacáiste.
Tá roinnt meiteashonraí breise i Bootstrap package.json
faoi na heochracha seo a leanas:
less
- cosán chuig príomhchomhad foinse Bootstrap Lessstyle
- cosán chuig CSS neamh-mhionnaithe Bootstrap atá réamhthiomsaithe ag baint úsáide as na socruithe réamhshocraithe (gan oiriúnú)Is féidir leat freisin Bootstrap's Less, CSS, JavaScript, agus clónna a shuiteáil agus a bhainistiú ag baint úsáide as Cumadóir :
Úsáideann Bootstrap Autoprefixer chun déileáil le réimíreanna díoltóirí CSS . Má tá Bootstrap á thiomsú agat óna fhoinse Less/Sass agus mura bhfuil ár Gruntfile á úsáid agat, beidh ort Autoprefixer a chomhtháthú isteach i do phróiseas tógála tú féin. Má tá tú ag baint úsáide as Bootstrap réamh-thiomsaithe nó ag baint úsáide as ár Gruntfile, ní gá duit a bheith buartha faoi seo toisc go bhfuil Autoprefixer comhtháite inár Gruntfile cheana féin.
Is féidir Bootstrap a íoslódáil i dhá fhoirm, ina bhfaighidh tú na heolairí agus na comhaid seo a leanas, ag grúpáil acmhainní coitianta go loighciúil agus ag soláthar éagsúlachtaí tiomsaithe agus mionathraithe.
Tabhair faoi deara le do thoil go dteastaíonn jQuery le gach breiseán JavaScript a chur san áireamh, mar a thaispeántar sa teimpléad tosaithe . Téigh i gcomhairle lenár n-bower.json
aghaidh le fáil amach cé na leaganacha de jQuery a fhaigheann tacaíocht.
Nuair a bheidh sé íoslódáilte, dízip an fillteán comhbhrúite chun struchtúr Bootstrap (an tiomsaithe) a fheiceáil. Feicfidh tú rud mar seo:
Is é seo an fhoirm is bunúsaí de Bootstrap: comhaid réamh-thiomsaithe le haghaidh úsáide buail isteach tapa i mbeagnach aon tionscadal gréasáin. Soláthraímid CSS agus JS ( bootstrap.*
) tiomsaithe , chomh maith le CSS agus JS ( bootstrap.min.*
) tiomsaithe agus mionghearrtha. Tá léarscáileanna foinse CSS ( bootstrap.*.map
) ar fáil le húsáid le huirlisí forbróra brabhsálaithe áirithe. Áirítear clónna ó Glyphicons, mar atá an téama Bootstrap roghnach.
Áirítear le híoslódáil cód foinse Bootstrap na sócmhainní CSS, JavaScript, agus cló réamh- thiomsaithe, chomh maith le Foinse Lúide, JavaScript, agus doiciméadú. Go sonrach, cuimsíonn sé na nithe seo a leanas agus níos mó:
Is iad na less/
, , js/
, agus fonts/
an cód foinse dár gclónna CSS, JS, agus deilbhín (faoi seach). Áirítear leis an dist/
bhfillteán gach rud atá liostaithe sa rannán íoslódála réamhthiomsaithe thuas. Áiríonn docs/
an fillteán an cód foinse dár ndoiciméadú agus examples/
úsáid Bootstrap. Thairis sin, soláthraíonn aon chomhad eile atá san áireamh tacaíocht do phacáistí, faisnéis cheadúnais, agus forbairt.
Úsáideann Bootstrap Grunt dá chóras tógála, le modhanna áisiúla chun oibriú leis an gcreat. Sin é an chaoi a ndéanaimid ár gcód a thiomsú, tástálacha a reáchtáil, agus go leor eile.
Chun Grunt a shuiteáil, ní mór duit nóde.js a íoslódáil agus a shuiteáil (lena n-áirítear npm). Seasann npm do mhodúil pacáistithe nód agus is bealach é chun spleáchais forbartha a bhainistiú trí nód.js.
Ansin, ón líne ordaithe:grunt-cli
ar fud an domhain le npm install -g grunt-cli
./bootstrap/
, ansin rith npm install
. Breathnóidh npm ar an package.json
gcomhad agus déanfaidh sé na spleáchais áitiúla riachtanacha atá liostaithe ann a shuiteáil go huathoibríoch.Nuair a bheidh tú críochnaithe, beidh tú in ann na horduithe éagsúla Grunt a sholáthraítear ón líne ordaithe a rith.
grunt dist
(Níl ort ach CSS agus JavaScript a thiomsú)Athghintear an t- /dist/
eolaire le comhaid CSS agus JavaScript atá tiomsaithe agus miondealaithe. Mar úsáideoir Bootstrap, is é seo an t-ordú a theastaíonn uait de ghnáth.
grunt watch
(Féach)Féachann sé ar na comhaid foinse Lúide agus cuireann sé le chéile go CSS iad go huathoibríoch nuair a shábhálann tú athrú.
grunt test
(Rith tástálacha)Ritheann JSHint agus ritheann na tástálacha QUnit gan ceann i PhantomJS .
grunt docs
(Tóg & tástáil na sócmhainní docs)Tógann agus tástálacha CSS, JavaScript, agus sócmhainní eile a úsáidtear agus an doiciméadú á rith go háitiúil trí bundle exec jekyll serve
.
grunt
(Tóg go hiomlán gach rud agus reáchtáil tástálacha)Déanann CSS agus JavaScript a thiomsú agus a mhionlaghdú, tógann sé an suíomh Gréasáin doiciméadúcháin, ritheann an bailíochtóir HTML5 i gcoinne na ndoiciméad, athghintear sócmhainní an Chustaiméara, agus tuilleadh. Éilíonn Jekyll . De ghnáth ní gá ach amháin má tá tú ag hackáil ar Bootstrap féin.
Má bhíonn fadhbanna agat le spleáchais a shuiteáil nó le horduithe Grunt a rith, scrios ar dtús an t- /node_modules/
eolaire ginte ag npm. Ansin, athrith npm install
.
Tosaigh leis an teimpléad HTML bunúsach seo, nó modhnaigh na samplaí seo . Tá súil againn go ndéanfaidh tú ár dteimpléid agus ár samplaí a shaincheapadh, agus iad á gcur in oiriúint do do chuid riachtanas.
Cóipeáil an HTML thíos chun tosú ag obair le doiciméad Bootstrap íosta.
Tóg ar an teimpléad bunúsach thuas le go leor comhpháirteanna Bootstrap. Molaimid duit Bootstrap a shaincheapadh agus a oiriúnú chun freastal ar riachtanais do thionscadail aonair.
Faigh an cód foinse do gach sampla thíos tríd an stór Bootstrap a íoslódáil . Is féidir samplaí a fháil san docs/examples/
eolaire.
Saincheap an barra nascleanúna agus timpealláin, ansin cuir roinnt comhpháirteanna nua leis.
Struchtúr bunúsach le haghaidh painéal riaracháin le barra taoibh seasta agus barra nascleanúna.
Leagan amach agus dearadh na foirme saincheaptha le haghaidh comhartha simplí i bhfoirm.
Cruthaigh barra nascleanúna saincheaptha le naisc inchosanta. Cinnirí suas! Níl sé ró-chairdiúil do Safari.
Is é Bootlint an uirlis oifigiúil línéar HTML Bootstrap. Seiceálann sé go huathoibríoch roinnt botúin HTML coitianta ar leathanaigh ghréasáin a úsáideann Bootstrap ar bhealach cothrom "vanilla". Éilíonn comhpháirteanna/giuirléidí Vanilla Bootstrap go gcloífeadh a gcuid codanna den DOM le struchtúir áirithe. Seiceálann Bootlint go bhfuil HTML struchtúrtha i gceart ag cásanna de chomhpháirteanna Bootstrap. Smaoinigh ar Bootlint a chur le do slabhra uirlisí forbartha gréasáin Bootstrap ionas nach gcuirfidh aon cheann de na botúin choitianta moill ar fhorbairt do thionscadail.
Bí ar an eolas faoi fhorbairt Bootstrap agus déan teagmháil leis an bpobal leis na hacmhainní cabhracha seo.
irc.freenode.net
fhreastalaí, sa chainéal ##bootstrap .twitter-bootstrap-3
.bootstrap
ar phacáistí a athraíonn nó a chuireann le feidhmiúlacht Bootstrap agus iad á ndáileadh trí npm nó meicníochtaí seachadta comhchosúla le haghaidh infhionnachtana uasta.Is féidir leat @getbootstrap a leanúint ar Twitter freisin chun na gossip is déanaí agus físeáin ceoil iontacha a fháil.
Déanann Bootstrap do leathanaigh a oiriúnú go huathoibríoch do mhéideanna éagsúla scáileáin. Seo conas an ghné seo a dhíchumasú ionas go n-oibríonn do leathanach mar an sampla neamhfhreagrach seo .
<meta>
luaitear sna doiciméid CSS ar lárwidth
ar an .container
do gach sraith greille le leithead amháin, mar shampla width: 970px !important;
Bí cinnte go dtagann sé seo tar éis an CSS réamhshocraithe Bootstrap. Is féidir leat an rogha a sheachaint !important
le ceisteanna ó na meáin nó le roinnt roghnóir-fu..col-xs-*
ranganna de bhreis ar, nó in ionad, na cinn mheánacha/mór. Ná bíodh imní ort, tá scálaí greille na ngléasanna seach-bheaga de réir a chéile ag gach rún.Beidh Respond.js uait fós le haghaidh IE8 (toisc go bhfuil ár bhfiosruithe ó na meáin fós ann agus gur gá iad a phróiseáil). Díchumasaíonn sé seo na gnéithe "suíomh soghluaiste" de Bootstrap.
Táimid tar éis na céimeanna seo a chur i bhfeidhm ar shampla. Léigh a cód foinse chun na hathruithe sonracha a cuireadh i bhfeidhm a fheiceáil.
Ag féachaint le haistriú ó leagan níos sine de Bootstrap go v3.x? Breathnaigh ar ár dtreoir imirce .
Tá Bootstrap tógtha chun oibriú is fearr sna brabhsálaithe deisce agus móibíleacha is déanaí, rud a chiallaíonn go bhféadfadh go dtaispeánfadh brabhsálaithe níos sine rindreálacha de chomhpháirteanna áirithe ar stíleanna éagsúla, cé go bhfuil siad ag feidhmiú go hiomlán.
Go sonrach, tacaímid leis na leaganacha is déanaí de na brabhsálaithe agus na hardáin seo a leanas.
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.
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 | |
---|---|---|---|
Android | Tacaithe | Tacaithe | N / A |
iOS | Tacaithe | Tacaithe | Tacaithe |
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 | Opera | Safari | |
---|---|---|---|---|---|
Mac | Tacaithe | Tacaithe | N / A | Tacaithe | Tacaithe |
Windows | Tacaithe | Tacaithe | Tacaithe | Tacaithe | Gan tacaíocht |
Ar Windows, tacaímid le Internet Explorer 8-11 .
I gcás Firefox, chomh maith leis an ngnáthscaoileadh cobhsaí is déanaí, tacaímid freisin leis an Eisiúint Tacaíochta Breisithe (ESR) is déanaí. de Firefox.
Go neamhoifigiúil, ba chóir go mbeadh Bootstrap ag breathnú agus a iompar go maith go leor i gCróimiam agus Chrome le haghaidh Linux, Firefox le haghaidh Linux, agus Internet Explorer 7, chomh maith le Microsoft Edge, 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 .
Tacaítear le Internet Explorer 8 agus 9 freisin, ach tabhair faoi deara nach dtacaíonn na brabhsálaithe seo go hiomlán le roinnt airíonna CSS3 agus eilimintí HTML5. Ina theannta sin, éilíonn Internet Explorer 8 go n-úsáidfear Respond.js chun tacaíocht a thabhairt do cheisteanna meán.
Gné | Internet Explorer 8 | Internet Explorer 9 |
---|---|---|
border-radius |
Gan tacaíocht | Tacaithe |
box-shadow |
Gan tacaíocht | Tacaithe |
transform |
Gan tacaíocht | Tacaithe, le -ms réimír |
transition |
Gan tacaíocht | |
placeholder |
Gan tacaíocht |
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.
Bí ar an airdeall faoi na caveatanna seo a leanas agus tú ag úsáid Respond.js i do thimpeallachtaí forbartha agus táirgthe do Internet Explorer 8.
Le Respond.js a úsáid le CSS arna óstáil ar (fo)fhearann eile (mar shampla, ar CDN) tá roinnt socruithe breise ag teastáil. Féach ar na doiciméid Respond.js le haghaidh sonraí.
file://
De bharr rialacha slándála an bhrabhsálaí, ní oibríonn Respond.js le leathanaigh a bhreathnaítear orthu tríd an file://
bprótacal (amhail nuair a osclaítear comhad HTML áitiúil). Chun gnéithe sofhreagracha in IE8 a thástáil, féach ar do leathanaigh thar HTTP(S). Féach ar na doiciméid Respond.js le haghaidh sonraí.
@import
Ní oibríonn Respond.js le CSS a ndéantar tagairt dó trí @import
. Go háirithe, is eol go n-úsáideann roinnt cumraíochtaí Drupal @import
. Féach ar na doiciméid Respond.js le haghaidh sonraí.
Ní thacaíonn IE8 go hiomlán box-sizing: border-box;
nuair a chuirtear le min-width
, max-width
, min-height
, nó max-height
. Ar an ábhar sin, amhail v3.0.1, ní úsáidimid a thuilleadh max-width
ar .container
s.
Tá roinnt fadhbanna ag IE8 @font-face
nuair a chomhcheanglaítear é le :before
. Úsáideann Bootstrap an meascán sin lena Glyphicons. Má tá leathanach i dtaisce, agus á luchtú gan an luch thar an bhfuinneog (ie buail an cnaipe athnuachana nó lódáil rud éigin i iframe) ansin déantar an leathanach a rindreáil sula lódálann an cló. Taispeánfar cuid de na deilbhíní agus tú ag hovering thar an leathanach (comhlacht) agus taispeánfar iad siúd chomh maith le hovering thar na deilbhíní eile. Féach eagrán #13863 le haghaidh sonraí.
Ní thacaítear le Bootstrap sna sean-mhodhanna comhoiriúnachta Internet Explorer. Le bheith cinnte go bhfuil tú ag baint úsáide as an modh rindreála is déanaí le haghaidh IE, smaoinigh ar an <meta>
gclib chuí a chur ar do leathanaigh:
Deimhnigh an modh doiciméad trí na huirlisí dífhabhtaithe a oscailt: brúigh F12agus seiceáil an "Mód Doiciméid".
Tá an chlib seo san áireamh i gcáipéisíocht agus i samplaí uile Bootstrap chun an rindreáil is fearr is féidir a chinntiú i ngach leagan tacaithe de Internet Explorer.
Féach an cheist StackOverflow seo le haghaidh tuilleadh faisnéise.
Ní dhéanann Internet Explorer 10 idirdhealú idir leithead an ghléis agus leithead an amhairc , agus mar sin ní chuireann sé na ceisteanna meán i CSS Bootstrap i bhfeidhm i gceart. De ghnáth níl le déanamh agat ach blúire sciobtha CSS a chur leis chun é seo a shocrú:
Mar sin féin, ní oibríonn sé seo le haghaidh feistí atá ag rith leaganacha Windows Phone 8 níos sine ná Nuashonrú 3 (aka GDR3) , toisc go n-eascraíonn sé go dtaispeánann feistí den sórt sin radharc deisce den chuid is mó in ionad radharc cúng "teileafóin". Chun dul i ngleic leis seo, beidh ort an CSS agus JavaScript seo a leanas a chur san áireamh chun oibriú timpeall an fhabht .
Le haghaidh tuilleadh faisnéise agus treoirlínte úsáide, léigh Windows Phone 8 agus Device-Width .
Mar cheann ar aghaidh, cuirimid é seo san áireamh i gcáipéisíocht agus samplaí Bootstrap ar fad mar léiriú.
Bhí roinnt trioblóide ag inneall rindreála na leaganacha de Safari roimh v7.1 do OS X agus Safari do iOS v8.0 le líon na n-ionad deachúil a úsáideadh inár .col-*-1
ranganna greille. Mar sin dá mbeadh 12 cholún greille aonair agat, thabharfá faoi deara gur tháinig siad aníos gearr i gcomparáid le sraitheanna eile de cholúin. Chomh maith le Safari/iOS a uasghrádú, tá roinnt roghanna agat maidir le réitigh oibre:
.pull-right
le do cholún greille deiridh chun an t-ailíniú crua-dheis a fháilTá 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 .
Amhail iOS 9.3, 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 .
Chomh maith leis sin, tabhair faoi deara má tá tú ag baint úsáide as nascleanúna seasta nó ag baint úsáide as ionchuir laistigh de mhodh, tá fabht rindreála ag iOS nach nuashonraíonn suíomh na n-eilimintí seasta nuair a spreagtar an méarchlár fíorúil. I measc roinnt réitigh ina leith seo tá d’eilimintí a athrú position: absolute
nó lasc ama ar fhócas a agairt chun iarracht a dhéanamh an suíomh a cheartú de láimh. Ní láimhseálann Bootstrap é seo, mar sin is fútsa atá sé cinneadh a dhéanamh ar an réiteach is fearr do d’iarratas.
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 ).
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.
:hover
/ :focus
ar shoghluaisteCé nach féidir hovering fíor a dhéanamh ar fhormhór na scáileáin tadhaill, déanann an chuid is mó de na brabhsálaithe soghluaiste aithris ar thacaíocht hovering agus déanann siad :hover
"greamaitheach". I bhfocail eile, :hover
tosaíonn stíleanna ag cur i bhfeidhm tar éis dóibh eilimint a thapáil agus ní stopann siad ag cur isteach orthu ach amháin tar éis don úsáideoir gné éigin eile a thapú. D’fhéadfadh sé seo a bheith ina chúis le stáit Bootstrap :hover
a bheith “i bhfostú” go neamh-inmhianaithe ar bhrabhsálaithe dá leithéid. Déanann roinnt brabhsálaithe soghluaiste :focus
greamaitheach freisin. Níl aon réiteach simplí ar na saincheisteanna seo faoi láthair seachas stíleanna den sórt sin a bhaint go hiomlán.
Fiú i roinnt brabhsálaithe nua-aimseartha, is féidir le priontáil a bheith neamhghnách.
Go háirithe, amhail Chrome v32 agus beag beann ar shocruithe corrlaigh, úsáideann Chrome leithead amhairc atá i bhfad níos cúinge ná méid an pháipéir fhisiciúil nuair a bhíonn fiosrúcháin ó na meáin á réiteach agus leathanach gréasáin á phriontáil. Mar thoradh air seo is féidir greille seach-bheag Bootstrap a chur i ngníomh gan choinne agus é á phriontáil. Féach eagrán #12078 agus fabht Chrome #273306 le haghaidh roinnt sonraí. Réitigh oibre a mholtar:
@screen-*
athróg Lúide ionas go measfar do pháipéar printéir a bheith níos mó ná an páipéar priontála eile.Chomh maith leis sin, amhail Safari v8.0, is féidir le leithead seasta .container
a chur faoi deara go n-úsáideann Safari clómhéid neamhghnách beag agus é ag priontáil. Féach #14868 agus WebKit fabht #138192 le haghaidh tuilleadh sonraí. Réiteach féideartha amháin chuige seo is ea an CSS seo a leanas a chur leis:
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.
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.
Ar mhaith leat sampla a fheiceáil? Amharc ar an taispeántas JS Bin seo.
Chun an taithí is fearr is féidir a sholáthar do sheanbhrabhsálaithe agus do bhrabhsálaithe bugaí, úsáideann Bootstrap hacks brabhsálaí CSS in áiteanna éagsúla chun CSS speisialta a dhíriú ar leaganacha áirithe de bhrabhsálaí chun oibriú timpeall ar fhabhtanna sna brabhsálaithe iad féin. Is intuigthe go mbíonn na hacks seo ina gcúis le bailíochtaithe CSS gearán a dhéanamh go bhfuil siad neamhbhailí. I gcúpla áit, bainimid úsáid freisin as gnéithe tuirlingthe CSS nach bhfuil caighdeánaithe go hiomlán fós, ach ní úsáidtear iad seo ach amháin le haghaidh feabhsaithe forásach.
Ní hionann na rabhaidh bailíochtaithe seo go praiticiúil ós rud é go ndéanann an chuid neamh-hacky dár CSS bailíochtú go hiomlán agus nach gcuireann na codanna hacky isteach ar fheidhmiú ceart na coda neamhhacky, mar sin an fáth a ndéanaimid neamhaird d'aon ghnó ar na rabhaidh áirithe seo.
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 .
Cé nach dtugaimid tacaíocht oifigiúil d’aon fhorlíontáin ná d’aon bhreiseáin tríú páirtí, cuirimid roinnt comhairle úsáideach ar fáil chun cabhrú le fadhbanna féideartha i do thionscadail a sheachaint.
Tagann roinnt bogearraí tríú páirtí, lena n-áirítear Google Maps agus Google Custom Search Engine, i gcoimhlint le Bootstrap mar gheall ar * { box-sizing: border-box; }
, riail a fhágann padding
nach mbíonn tionchar aige ar leithead ríofa deiridh eilimint. Foghlaim tuilleadh faoi mhúnla bosca agus méid ag CSS Seifteanna .
Ag brath ar an gcomhthéacs, féadfaidh tú sáraíocht a dhéanamh de réir mar is gá (Rogha 1) nó méid an bhosca a athshocrú do réigiúin iomlána (Rogha 2).
Cloíonn Bootstrap caighdeáin chomhchoiteanna gréasáin agus — le hiarracht bhreise íosta — is féidir é a úsáid chun suíomhanna a chruthú a bhfuil rochtain orthu siúd a úsáideann AT .
Má tá go leor naisc ag do nascleanúint agus má thagann sé roimh an bpríomhábhar sa DOM, cuir Skip to main content
nasc roimh an nascleanúint (le haghaidh míniú simplí, féach an t-alt seo Tionscadal A11Y ar naisc scipeála loingseoireachta ). Trí úsáid a bhaint as an .sr-only
rang cuirfear an nasc scipeála i bhfolach go radhairc, agus cinnteoidh an .sr-only-focusable
rang go mbeidh an nasc infheicthe nuair a bheidh sé dírithe (d’úsáideoirí méarchláir a bhfuil radharc orthu).
De bharr easnaimh/fabhtanna le fada an lá in Chrome (féach eagrán 262171 sa rianaitheoir fabhtanna Cróimiam ) agus Internet Explorer (féach an t-alt seo ar naisc i-leathanaigh agus ord fócais ), beidh ort a chinntiú gurb é sprioc do nasc scipeála ar a laghad atá dírithe ar chláir trí tabindex="-1"
.
Ina theannta sin, b'fhéidir gur mhaith leat tásc fócas infheicthe ar an sprioc a shochtadh go sainráite (go háirithe mar a leagann Chrome faoi láthair freisin díriú ar eilimintí tabindex="-1"
nuair a chliceáiltear iad leis an luch) le #content:focus { outline: none; }
.
Tabhair faoi deara go mbeidh tionchar ag an bhfabht seo freisin ar aon naisc intí eile a d’fhéadfadh do shuíomh a bheith in úsáid, rud a fhágfaidh go mbeidh siad gan úsáid d’úsáideoirí méarchláir. B’fhéidir go smaoineodh tú ar shocrú stad-bhearna comhchosúil a chur le gach ancaire / aitheantóir blúirí ainmnithe eile a fheidhmíonn mar spriocanna naisc.
Agus ceannteidil ( <h1>
- <h6>
) á neadú agat, ba cheart go mbeadh do phríomh-cheanntásc doiciméad mar <h1>
. Ba cheart úsáid loighciúil a bhaint as ceannteidil ina dhiaidh sin <h2>
- <h6>
ionas gur féidir le léitheoirí scáileáin clár ábhar a chruthú do do leathanaigh.
Foghlaim tuilleadh ag HTML CodeSniffer agus Penn State's AccessAbility .
Faoi láthair, tá cuid de na teaglaim réamhshocraithe dathanna atá ar fáil i Bootstrap (amhail na haicmí cnaipe styled éagsúla, cuid de na dathanna béime cód a úsáidtear le haghaidh bloic cód bunúsacha , an rang cúntóir .bg-primary
cúlra comhthéacsúla , agus an dath nasc réamhshocraithe nuair a úsáidtear é ar chúlra bán) cóimheas codarsnachta íseal a bheith acu (faoi bhun an chóimheas molta de 4.5:1 ). Is féidir leis seo fadhbanna a chruthú d’úsáideoirí lagamhairc nó d’úsáideoirí atá dall ar dhath. Seans go mbeidh gá leis na dathanna réamhshocraithe seo a mhodhnú chun a gcodarsnacht agus a n-inléiteacht a mhéadú.
Scaoiltear Bootstrap faoin gceadúnas MIT agus is cóipcheart 2016 Twitter é. Boiled síos go dtí smután níos lú, is féidir é a chur síos leis na coinníollacha seo a leanas.
Tá ceadúnas iomlán Bootstrap suite i stór an tionscadail chun tuilleadh eolais a fháil.
Tá doiciméid Bootstrap aistrithe go teangacha éagsúla ag baill an phobail. Ní thacaítear le haon cheann acu go hoifigiúil agus b’fhéidir nach mbíonn siad cothrom le dáta i gcónaí.
Ní chuidímid le haistriúcháin a eagrú ná a óstáil, ní dhéanaimid ach nasc a dhéanamh leo.
Críochnaithe aistriúchán nua nó níos fearr? Oscail iarratas tarraingthe chun é a chur lenár liosta.