Hanomboka
Famintinana momba ny Bootstrap, ny fomba fampidinana sy fampiasana, modely fototra sy ohatra, ary maro hafa.
Famintinana momba ny Bootstrap, ny fomba fampidinana sy fampiasana, modely fototra sy ohatra, ary maro hafa.
Bootstrap (v3.3.7 amin'izao fotoana izao) dia manana fomba tsotra vitsivitsy hanombohana haingana, ny tsirairay dia manintona ny haavon'ny fahaiza-manao sy ny tranga fampiasana. Vakio hatramin'izay mba hahitana izay mifanaraka amin'ny filanao manokana.
CSS, JavaScript, ary endri-tsoratra novolavolaina. Tsy misy antontan-taratasy na rakitra loharano tany am-boalohany tafiditra.
Source Less, JavaScript, ary rakitra endri-tsoratra, miaraka amin'ny dokanay. Mitaky compiler kely sy fanamboarana sasany.
Bootstrap nafindra avy amin'ny Less to Sass mba hampidirana mora amin'ny tetikasa Rails, Compass, na Sass ihany.
Ny olona ao amin'ny jsDelivr dia manome fanohanana CDN ho an'ny CSS sy JavaScript an'ny Bootstrap. Ampiasao fotsiny ireto rohy Bootstrap CDN ireto.
Azonao atao koa ny mametraka sy mitantana ny Bootstrap's Less, CSS, JavaScript, ary endritsoratra mampiasa Bower :
Azonao atao koa ny mametraka Bootstrap mampiasa npm :
require('bootstrap')
dia hampiditra ny plugins jQuery rehetra an'ny Bootstrap ao amin'ny jQuery object. Ny bootstrap
module mihitsy dia tsy manondrana na inona na inona. Azonao atao ny mametaka ny plugins jQuery an'ny Bootstrap tsirairay amin'ny alàlan'ny fametahana ireo /js/*.js
rakitra eo ambanin'ny lahatahiry ambony indrindra amin'ny fonosana.
Ny Bootstrap dia package.json
misy metadata fanampiny eo ambanin'ireto fanalahidy manaraka ireto:
less
- lalana mankany amin'ny rakitra loharanon'ny Bootstrap lehibe indrindrastyle
- lalana mankany amin'ny CSS tsy nohamafisina an'i Bootstrap izay efa natambatra tamin'ny alàlan'ny filaharana default (tsy misy fanamboarana)Azonao atao koa ny mametraka sy mitantana ny Bootstrap's Less, CSS, JavaScript, ary endri-tsoratra mampiasa Composer :
Bootstrap dia mampiasa Autoprefixer mba hiatrehana ireo prefix mpivarotra CSS . Raha manangona Bootstrap avy amin'ny loharano Less/Sass ianao ary tsy mampiasa ny Gruntfile, dia mila mampiditra Autoprefixer amin'ny dingana fananganana anao ianao. Raha mampiasa Bootstrap efa voaomana ianao na mampiasa ny Gruntfile, dia tsy mila manahy momba izany ianao satria efa tafiditra ao anatin'ny Gruntfile ny Autoprefixer.
Ny Bootstrap dia azo alaina amin'ny endrika roa, ao anatin'izany no ahitanao ireto lahatahiry sy rakitra manaraka ireto, manambatra ny loharanom-baovao mahazatra ary manome ny fiovaovana voaangona sy ahena.
Mariho fa ny plugin JavaScript rehetra dia mitaky jQuery ampidirina, araka ny aseho amin'ny môdely fanombohana . Jereo ny anaybower.json
mba hahitana hoe iza amin'ireo dikan-jQuery no tohana.
Vantany vao alaina dia sokafy ny lahatahiry voatsindry hahitana ny firafitry ny (ilay natambatra) Bootstrap. Hahita zavatra toy izao ianao:
Ity no endrika fototra indrindra amin'ny Bootstrap: rakitra efa voaomana ho an'ny fampiasana haingana haingana amin'ny tetikasa tranonkala rehetra. Manome CSS sy JS ( bootstrap.*
), ary koa CSS sy JS ( bootstrap.min.*
). Ny sarintany loharano CSS ( bootstrap.*.map
) dia azo ampiasaina amin'ny fitaovana mpamorona mpitety tranonkala sasany. Misy endri-tsoratra avy amin'ny Glyphicons, ary koa ny lohahevitra Bootstrap azo atao.
Ny fampidinana kaody loharanon'ny Bootstrap dia ahitana ny CSS, JavaScript, ary ny endri-tsoratra, miaraka amin'ny loharano Less, JavaScript ary antontan-taratasy. Amin'ny ankapobeny dia misy ireto manaraka ireto sy ny maro hafa:
Ny less/
, js/
, ary fonts/
no kaody loharanon'ny CSS, JS, ary ny endri-tsoratra kisary (isany). Ny dist/
lahatahiry dia ahitana ny zava-drehetra voatanisa ao amin'ny fizarana fampidinana efa voaomana etsy ambony. Ny docs/
lahatahiry dia ahitana ny kaody loharano ho an'ny antontan-taratasintsika, sy examples/
ny fampiasana Bootstrap. Ankoatra izany, ny rakitra hafa rehetra dia manome fanohanana ny fonosana, ny fampahalalana momba ny fahazoan-dàlana ary ny fampandrosoana.
Bootstrap dia mampiasa Grunt ho an'ny rafitra fananganana azy, miaraka amin'ny fomba mety amin'ny fiasana amin'ny rafitra. Izany no fomba hanangonanay ny kaodinay, hanaovana fitsapana, sy ny maro hafa.
Mba hametrahana Grunt dia tsy maintsy misintona sy mametraka node.js (izay misy npm) aloha ianao. npm dia mijoro ho an'ny maody node fonosana ary fomba iray hitantana ny fiankinan-doha amin'ny fampandrosoana amin'ny alàlan'ny node.js.
Avy eo, avy amin'ny andalana baiko:grunt-cli
maneran-tany miaraka amin'ny npm install -g grunt-cli
./bootstrap/
lahatahiry fototra, avy eo mihazakazaka npm install
. npm dia hijery ny package.json
rakitra ary hametraka ho azy ireo fiankinan-doha ilaina eo an-toerana voatanisa ao.Rehefa vita ianao dia afaka mampandeha ireo baiko Grunt isan-karazany omena avy amin'ny tsipika baiko.
grunt dist
(Amboary fotsiny ny CSS sy JavaScript)Mamerina indray ny /dist/
lahatahiry miaraka amin'ny rakitra CSS sy JavaScript voaangona sy nohamafisina. Amin'ny maha-mpampiasa Bootstrap azy dia io no baiko tadiavinao.
grunt watch
(Jereo)Mijery ireo rakitra loharano Kely ary mamerina azy ireo ho azy amin'ny CSS isaky ny mitahiry fanovana ianao.
grunt test
(Manao andrana)Mandeha JSHint ary mitantana ny fitsapana QUnit tsy misy lohany ao amin'ny PhantomJS .
grunt docs
(Amboary & andramo ny fananan'ny docs)Manangana sy mitsapa CSS, JavaScript, ary fananana hafa izay ampiasaina amin'ny fampandehanana ny antontan-taratasy eo an-toerana amin'ny alàlan'ny bundle exec jekyll serve
.
grunt
(Amboary tanteraka ny zava-drehetra ary manaova fitsapana)Manangona sy manamaivana ny CSS sy JavaScript, manorina ny tranokalan'ny antontan-taratasy, mitantana ny HTML5 validator amin'ny doka, mamerina ny fananan'ny Customizer, sy ny maro hafa. Mitaky Jekyll . Matetika dia ilaina ihany raha toa ianao ka mijirika amin'ny Bootstrap mihitsy.
Raha sendra olana ianao amin'ny fametrahana ny fiankinan-doha na ny baiko Grunt dia esory aloha ny /node_modules/
lahatahiry novokarin'ny npm. Avy eo, avereno indray npm install
.
Atombohy amin'ity môdely HTML fototra ity, na ovao ireto ohatra ireto . Manantena izahay fa hampifanaraka ny môdely sy ohatra izahay, hampifanaraka azy ireo hifanaraka amin'ny filanao.
Adikao ny HTML etsy ambany mba hanombohana miasa miaraka amin'ny antontan-taratasy Bootstrap kely indrindra.
Amboary amin'ny maodely fototra etsy ambony miaraka amin'ireo singa maro ao amin'ny Bootstrap. Mamporisika anao izahay hanamboatra sy hampifanaraka ny Bootstrap hifanaraka amin'ny filan'ny tetikasanao manokana.
Raiso ny kaody loharano ho an'ny ohatra rehetra etsy ambany amin'ny alàlan'ny fampidinana ny tahiry Bootstrap . Misy ohatra hita ao amin'ny docs/examples/
lahatahiry.
Tsy misy afa-tsy ny fototra: nanangona CSS sy JavaScript miaraka amin'ny container.
Ampidiro ny lohahevitry ny Bootstrap azo atao mba hahazoana traikefa nohatsaraina.
Fandrindrana bilaogy misy tsanganana roa miaraka amin'ny fitetezana manokana, lohapejy ary karazana.
Mamorona navbar mahazatra misy rohy voamarina. Fampitandremana! Tsy dia namana Safari loatra.
Bootlint no fitaovana ofisialy Bootstrap HTML linter . Izy io dia manara-maso ho azy ny fahadisoana HTML mahazatra maromaro ao amin'ny pejin-tranonkala izay mampiasa Bootstrap amin'ny fomba "vanilla". Ny singa/widget an'ny Vanilla Bootstrap dia mitaky ny ampahany amin'ny DOM mba hifanaraka amin'ny rafitra sasany. Ny Bootlint dia manamarina fa ny trangan'ny singa Bootstrap dia manana HTML voarafitra tsara. Eritrereto ny manampy an'i Bootlint amin'ny rojom-pitaovana fampivoarana tranonkala Bootstrap mba tsy hisian'ny fahadisoana mahazatra mampiadana ny fivoaran'ny tetikasanao.
Tohizo hatrany ny fivoaran'ny Bootstrap ary manatona ny vondrom-piarahamonina miaraka amin'ireo loharano mahasoa ireo.
irc.freenode.net
mpizara, ao amin'ny fantsona ##bootstrap .twitter-bootstrap-3
.bootstrap
amin'ny fonosana izay manova na manampy amin'ny fiasan'ny Bootstrap rehefa mizara amin'ny npm na mekanika fanaterana mitovitovy amin'izany mba hahitana haingana indrindra.Azonao atao ihany koa ny manaraka @getbootstrap ao amin'ny Twitter ho an'ny fifosana farany sy horonan-tsary mahafinaritra.
Bootstrap dia mampifanaraka ho azy ny pejinao amin'ny haben'ny efijery isan-karazany. Toy izao ny fomba hanafoanana ity endri-javatra ity mba handehanan'ny pejinao tahaka ity ohatra tsy mamaly ity .
<meta>
voalaza ao amin'ny CSS docswidth
eo amin'ny tsanganana .container
tsirairay amin'ny sakany tokana, ohatra width: 970px !important;
Ataovy azo antoka fa tonga aorian'ny CSS Bootstrap default izany. Azonao atao ny misoroka ny !important
fanontaniana amin'ny haino aman-jery na ny selector-fu..col-xs-*
kilasy ho fanampin'ny, na ho solon'ny, ny antonony/lehibe. Aza manahy, mizana mizana amin'ny fanapahan-kevitra rehetra ny rindran-damina fitaovana kely fanampiny.Mbola mila Respond.js ho an'ny IE8 ianao (satria mbola misy ny fanontaniantsika amin'ny haino aman-jery ary mila karakaraina). Izany dia manafoana ny lafiny "tranonkala finday" amin'ny Bootstrap.
Nampiharinay tamin'ny ohatra ireto dingana ireto. Vakio ny kaody loharanony raha te hahita ny fanovana manokana ampiharina.
Mitady hifindra avy amin'ny kinova taloha an'ny Bootstrap mankany v3.x? Jereo ny torolàlana momba ny fifindra-monina .
Bootstrap dia naorina mba hiasa tsara indrindra amin'ny desktop farany sy navigateur finday, midika izany fa ny navigateur tranainy dia mety hampiseho endrika hafa, na dia miasa tanteraka aza, ny dikan'ny singa sasany.
Indrindra indrindra, manohana ny kinova farany amin'ireto mpitety sy sehatra manaraka ireto izahay.
Ny navigateur hafa izay mampiasa ny kinova farany an'ny WebKit, Blink, na Gecko, na mivantana na amin'ny alàlan'ny API fijerena tranonkala an'ny sehatra, dia tsy tohanana mazava. Na izany aza, ny Bootstrap dia tokony (amin'ny ankamaroan'ny tranga) hiseho sy hiasa tsara amin'ireo navigateur ireo ihany koa. Misy fampahalalana fanampiny momba ny fanohanana omena eto ambany.
Amin'ny ankapobeny, ny Bootstrap dia manohana ny dikan-teny farany amin'ny navigateur default an'ny sehatra lehibe tsirairay. Mariho fa ny navigateur proxy (toy ny Opera Mini, ny maody Turbo an'ny Opera Mobile, UC Browser Mini, Amazon Silk) dia tsy manohana.
Chrome | Firefox | Safari | |
---|---|---|---|
Android | Nanohana | Nanohana | N / A |
iOS | Nanohana | Nanohana | Nanohana |
Toy izany koa, ny kinova farany indrindra amin'ny ankamaroan'ny navigateur desktop dia tohana.
Chrome | Firefox | Internet Explorer | opéra | Safari | |
---|---|---|---|---|---|
Mac | Nanohana | Nanohana | N / A | Nanohana | Nanohana |
am-baravarankely | Nanohana | Nanohana | Nanohana | Nanohana | Tsy zaka |
Amin'ny Windows, manohana Internet Explorer 8-11 izahay .
Ho an'ny Firefox, ankoatry ny famoahana stable mahazatra farany indrindra, dia manohana ny dikan-teny farany amin'ny Extended Support Release (ESR) an'ny Firefox ihany koa izahay.
Tsy ofisialy, Bootstrap dia tokony hijery sy hitondra tena tsara ao amin'ny Chromium sy Chrome ho an'ny Linux, Firefox ho an'ny Linux, ary Internet Explorer 7, ary koa ny Microsoft Edge, na dia tsy tohanana amin'ny fomba ofisialy aza izy ireo.
Raha mila lisitry ny sasany amin'ireo bibikely navigateur izay tsy maintsy atrehin'i Bootstrap, jereo ny Rindrin'ny bibikely navigateur .
Ny Internet Explorer 8 sy 9 dia tohana ihany koa, na izany aza, aoka ho fantatrao fa ny fananana CSS3 sy singa HTML5 sasany dia tsy tohanan'ireo mpitety tranonkala ireo. Fanampin'izany, ny Internet Explorer 8 dia mitaky ny fampiasana ny Respond.js mba ahafahana manohana ny fangatahana media.
endri-javatra | Internet Explorer 8 | Internet Explorer 9 |
---|---|---|
border-radius |
Tsy zaka | Nanohana |
box-shadow |
Tsy zaka | Nanohana |
transform |
Tsy zaka | Tohanana, misy -ms tovana |
transition |
Tsy zaka | |
placeholder |
Tsy zaka |
Tsidiho ny Azoko ampiasaina... raha mila antsipiriany momba ny fanohanan'ny navigateur ny endri-javatra CSS3 sy HTML5.
Mitandrema amin'ireto fampitandremana manaraka ireto rehefa mampiasa Respond.js amin'ny tontolon'ny fampandrosoana sy famokarana anao ho an'ny Internet Explorer 8.
Ny fampiasana Respond.js miaraka amin'ny CSS ampiantranoana amin'ny sehatra hafa (ohatra, amin'ny CDN) dia mitaky fanamboarana fanampiny. Jereo ny Respond.js docs raha mila antsipiriany.
file://
Noho ny fitsipika fiarovana amin'ny navigateur, Respond.js dia tsy miasa amin'ny pejy jerena amin'ny alàlan'ny file://
protocol (toy ny rehefa manokatra rakitra HTML eo an-toerana). Mba hitsapana ireo endri-javatra mandray andraikitra ao amin'ny IE8, jereo ny pejinao amin'ny HTTP(S). Jereo ny Respond.js docs raha mila antsipiriany.
@import
Respond.js dia tsy miasa miaraka amin'ny CSS izay voatondro amin'ny @import
. Amin'ny ankapobeny, ny sasany Drupal configurations dia fantatra fa mampiasa @import
. Jereo ny Respond.js docs raha mila antsipiriany.
Tsy manohana tanteraka ny IE8 box-sizing: border-box;
rehefa atambatra amin'ny min-width
, max-width
, min-height
, na max-height
. Noho izany antony izany, amin'ny v3.0.1, tsy mampiasa s intsony max-width
izahay .container
.
IE8 dia manana olana sasany @font-face
rehefa atambatra amin'ny :before
. Bootstrap dia mampiasa an'io fitambarana io miaraka amin'ny Glyphicons. Raha misy pejy iray voatahiry, ary fenoina tsy misy totozy eo amin'ny varavarankely (izany hoe tsindrio ny bokotra famelombelomana na asio zavatra ao anaty iframe) dia avoaka alohan'ny hidiran'ny endritsoratra ilay pejy. Ny fanodinkodinana eo amin'ny pejy (vatana) dia hampiseho ny sasany amin'ireo kisary ary ny fanodinkodinana eo amin'ireo kisary sisa dia hampiseho izany koa. Jereo ny laharana #13863 raha mila fanazavana fanampiny.
Bootstrap dia tsy tohanana amin'ny fomba fampifanarahana Internet Explorer taloha. Mba hahazoana antoka fa mampiasa ny fomba famadihana farany indrindra ho an'ny IE ianao, dia diniho ny hampiditra ny <meta>
marika mety amin'ny pejinao:
Hamafiso ny maodely antontan-taratasy amin'ny fanokafana ny fitaovana debugging: tsindrio F12ary jereo ny "Document Mode".
Ity tenifototra ity dia tafiditra ao anatin'ny antontan-taratasin'i Bootstrap sy ohatra rehetra mba hiantohana ny famoahana tsara indrindra azo atao amin'ny dikan-teny Internet Explorer tohana tsirairay.
Jereo ity fanontaniana StackOverflow ity raha mila fanazavana fanampiny.
Internet Explorer 10 dia tsy manavaka ny sakan'ny fitaovana amin'ny sakan'ny seranan -tsambo , ary noho izany dia tsy mampihatra araka ny tokony ho izy ny fangatahana media ao amin'ny CSS Bootstrap. Amin'ny ankapobeny dia ampiana sombintsombiny haingana amin'ny CSS ianao hamahana izany:
Na izany aza, tsy mety izany ho an'ny fitaovana mampiasa Windows Phone 8 dikan-teny tranainy kokoa noho ny Update 3 (aka GDR3) , satria mahatonga ny fitaovana toy izany hampiseho ny ankamaroan'ny desktop fa tsy mijery "telefaonina" tery. Mba hamahana izany dia mila mampiditra ireto CSS sy JavaScript manaraka ireto ianao mba hamahana ilay bug .
Raha mila fanazavana fanampiny sy torolalana momba ny fampiasana, vakio ny Windows Phone 8 sy ny Device-Width .
Amin'ny maha lohan-doha azy dia ampidirinay ao anatin'ny antontan-taratasy sy ohatra rehetra ao amin'ny Bootstrap izany ho fampisehoana.
Ny maotera fandikana ny dikan-tenin'ny Safari talohan'ny v7.1 ho an'ny OS X sy Safari ho an'ny iOS v8.0 dia nanana olana kely tamin'ny isan'ny toerana desimal ampiasaina amin'ny .col-*-1
kilasin'ny grid. Koa raha manana tsanganana tsanganana 12 ianao dia ho hitanao fa fohy izy ireo raha oharina amin'ny andalana hafa. Ankoatra ny fanavaozana ny Safari/iOS, dia manana safidy azo atao ianao:
.pull-right
amin'ny tsanganana grid-nao farany mba hahazoana ny fampifanarahana mafy havananaNy fanohanana overflow: hidden
amin'ny <body>
singa dia voafetra ihany amin'ny iOS sy Android. Mba hanaovana izany, rehefa mihodinkodina eo amin'ny tampony na ambany amin'ny mody iray amin'ny iray amin'ireo navigateur ireo fitaovana ireo ianao, <body>
dia manomboka mihodina ny atiny. Jereo Chrome bug #175502 (amboarina ao amin'ny Chrome v40) sy WebKit bug #153852 .
Amin'ny iOS 9.3, raha misokatra ny modal iray, raha toa ka ao anatin'ny sisin'ny soratra <input>
na <textarea>
, ny <body>
votoaty eo ambanin'ny modal dia hokodina fa tsy ny modal mihitsy. Jereo ny WebKit bug #153856 .
Mariho koa fa raha mampiasa navbar raikitra ianao na mampiasa fampidirana ao anatin'ny modal iray, iOS dia manana bug rendering izay tsy manavao ny toeran'ny singa raikitra rehefa voadona ny klavier virtoaly. Ny vahaolana vitsivitsy amin'izany dia ahitana ny fanovana ny singanao ho position: absolute
na ny fiantsoana fameram-potoana mifantoka mba hanandrana hanitsy ny fametrahan-tanana. Tsy vitan'ny Bootstrap io, ka anjaranao ny manapa-kevitra hoe inona no vahaolana tsara indrindra amin'ny fampiharanao.
Ny .dropdown-backdrop
singa dia tsy ampiasaina amin'ny iOS ao amin'ny nav noho ny fahasarotan'ny z-indexing. Noho izany, mba hanakatona ny dropdowns amin'ny navbars dia tsy maintsy manindry mivantana ny singa dropdown ianao (na singa hafa izay handrehitra hetsika kitiho ao amin'ny iOS ).
Tsy azo ihodivirana ny fampitomboana ny pejin'ny rindrankajy amin'ny singa sasany, na ao amin'ny Bootstrap na ny sisa amin'ny tranonkala. Miankina amin'ny olana, mety ho vitantsika ny manamboatra izany (mitadiava aloha ary manokatra olana raha ilaina). Na izany aza, mirona tsy miraharaha ireo isika satria matetika izy ireo dia tsy manana vahaolana mivantana afa-tsy ny hacky workarounds.
:hover
/ :focus
amin'ny findayNa dia tsy azo atao amin'ny ankamaroan'ny ecran touchy aza ny tena manidina, ny ankamaroan'ny navigateur finday dia maka tahaka ny fanohanana mihodinkodina ary manao :hover
"miraikitra". Raha lazaina amin'ny teny hafa, :hover
manomboka mihatra ny fomba rehefa manindry singa iray ary mijanona fotsiny rehefa manindry singa hafa ny mpampiasa. Izany dia mety hahatonga ny fanjakan'i Bootstrap :hover
ho lasa "miraikitra" amin'ny navigateur toy izany. Ny navigateur finday sasany koa dia manao :focus
toy izany koa. Tsy misy vahaolana tsotra ho an'ireo olana ireo amin'izao fotoana izao afa-tsy ny fanesorana tanteraka ireo fomba ireo.
Na dia amin'ny navigateur maoderina sasany aza, ny fanontana dia mety ho hafahafa.
Amin'ny ankapobeny, amin'ny Chrome v32 ary na inona na inona firafitry ny sisiny, ny Chrome dia mampiasa ny sakan'ny seranan-tsambo tery kokoa noho ny haben'ny taratasy ara-batana rehefa mamaha ny fanontanian'ny media rehefa manonta pejy web. Mety hiteraka tsy nampoizina ny tady kely fanampiny an'ny Bootstrap rehefa manonta. Jereo ny olana #12078 sy Chrome bug #273306 ho an'ny antsipiriany. Soso-kevitra vahaolana:
@screen-*
Variable Kely mba ho heverina ho lehibe kokoa noho ny kely kokoa ny taratasy mpanonta anao.Ary koa, amin'ny Safari v8.0, ny sakan'ny raikitra .container
dia mety hahatonga an'i Safari hampiasa habe kely tsy mahazatra rehefa manonta. Jereo ny #14868 sy WebKit bug #138192 raha mila fanazavana fanampiny. Ny vahaolana iray mety ho an'ity dia ny fampidirana ity CSS manaraka ity:
Eo ivelan'ny boaty, ny Android 4.1 (ary na dia ny famoahana vaovao sasany aza) dia alefa miaraka amin'ny app Browser ho navigateur tranonkala safidy (mifanohitra amin'ny Chrome). Indrisy anefa fa ny app Browser dia manana bug sy tsy mifanaraka amin'ny CSS amin'ny ankapobeny.
Amin'ny <select>
singa, ny navigateur stock Android dia tsy hampiseho ny fanaraha-maso amin'ny lafiny raha misy border-radius
sy/na border
ampiharina. (Jereo ity fanontaniana StackOverflow ity ho an'ny antsipiriany.) Ampiasao ny sombin-kaody etsy ambany hanesorana ny CSS manafintohina ary <select>
adika ho singa tsy misy endrika amin'ny navigateur stock Android. Misoroka ny fitsabahana amin'ny navigateur Chrome, Safari, ary Mozilla ny mpampiasa mpampiasa sniffing.
Te hahita ohatra? Jereo ity demo JS Bin ity.
Mba hanomezana traikefa tsara indrindra ho an'ny mpitety tranonkala taloha sy buggy, Bootstrap dia mampiasa hacks amin'ny navigateur CSS amin'ny toerana maromaro mba hikendry CSS manokana amin'ny dikan-tranonkala sasany mba hamahana ireo bibikely ao amin'ny navigateur. Ireo hacks ireo dia azo antoka fa mahatonga ny validators CSS hitaraina fa tsy manan-kery. Any amin'ny toerana roa dia mampiasa endri-javatra CSS bleeding-edge ihany koa izahay izay mbola tsy manara-penitra tanteraka, fa ireo dia ampiasaina ho fanatsarana miandalana.
Ireo fampitandremana fanamarinana ireo dia tsy misy dikany amin'ny fampiharana satria ny ampahany tsy hacky amin'ny CSS-ntsika dia manamarina tanteraka ary ny ampahany hacky dia tsy manelingelina ny fampandehanana araka ny tokony ho izy ny ampahany tsy mijirika, noho izany antony izany dia tsy miraharaha ireo fampitandremana manokana ireo isika.
Ny antontan-taratasy HTML anay koa dia manana fampitandremana fanamafisana HTML tsy misy dikany sy tsy misy dikany noho ny fampidiranay vahaolana ho an'ny bug Firefox iray .
Na dia tsy manohana amin'ny fomba ofisialy plugins na add-on avy amin'ny antoko fahatelo aza izahay, dia manolotra torohevitra mahasoa izahay mba hisorohana ny olana mety hitranga amin'ny tetikasanao.
Ny rindrambaikon'ny antoko fahatelo sasany, anisan'izany ny Google Maps sy ny Google Custom Search Engine, dia mifanohitra amin'ny Bootstrap noho ny * { box-sizing: border-box; }
, fitsipika iray izay mahatonga azy io padding
tsy hisy fiantraikany amin'ny sakan'ny kajy farany amin'ny singa iray. Mianara bebe kokoa momba ny maodely boaty sy ny habeny ao amin'ny CSS Tricks .
Miankina amin'ny teny manodidina, azonao atao ny manilika araka izay ilaina (Safidy 1) na mamerina ny fametahana boaty ho an'ny faritra manontolo (Safidy 2).
Ny Bootstrap dia manaraka ny fenitra mahazatra amin'ny tranonkala ary—miaraka amin'ny ezaka fanampiny kely indrindra—azo ampiasaina hamoronana tranokala azon'ireo mampiasa AT .
Raha misy rohy maro ny fitetezanao ary tonga alohan'ny votoaty lehibe ao amin'ny DOM, ampio Skip to main content
rohy alohan'ny fitetezana (raha mila fanazavana tsotra, jereo ity lahatsoratra momba ny Tetikasa A11Y momba ny rohy fitetezana skip ). Ny fampiasana ny .sr-only
kilasy dia hanafina an-tsary ny rohin'ny tsipìka, ary ny .sr-only-focusable
kilasy dia hiantoka fa ny rohy dia ho hita rehefa mifantoka (ho an'ireo mpampiasa klavier hita maso).
Noho ny tsy fahatomombanan'ny Chrome efa hatry ny ela (jereo ny laharana 262171 ao amin'ny Chromium bug tracker ) sy ny Internet Explorer (jereo ity lahatsoratra ity momba ny rohy ao anaty pejy sy ny filaharan'ny fifantohana ), mila maka antoka ianao fa ny lasibatra amin'ny rohin-tsidinao. dia farafaharatsiny azo hifantoka amin'ny programa amin'ny fanampiana tabindex="-1"
.
Ho fanampin'izany, azonao atao ny manafoana mazava ny famantarana fifantohana hita amin'ny kendrena (indrindra fa ny Chrome amin'izao fotoana izao dia mametraka fifantohana amin'ireo singa tabindex="-1"
rehefa kitihina amin'ny totozy) miaraka amin'ny #content:focus { outline: none; }
.
Mariho fa ity bibikely ity dia hisy fiantraikany amin'ny rohin'ny pejy hafa mety ampiasain'ny tranokalanao, ka mahatonga azy ireo ho tsy misy ilana azy ho an'ny mpampiasa klavier. Azonao atao ny mieritreritra ny hampiditra famahana ny elanelana mitovitovy amin'ireo mpamantatra vatofantsika / sombiny hafa rehetra izay miasa ho lasibatra rohy.
Rehefa mametraka lohateny ( <h1>
- <h6>
), ny lohatenin'ny antontan-taratasy voalohany dia tokony ho <h1>
. Ny lohateny manaraka dia tokony hampiasa lojika <h2>
- <h6>
mba ahafahan'ny mpamaky efijery manangana lisitry ny atiny ho an'ny pejinao.
Mianara bebe kokoa amin'ny HTML CodeSniffer sy ny AccessAbility an'ny Penn State .
Amin'izao fotoana izao, ny sasany amin'ireo fampifangaroana loko mahazatra hita ao amin'ny Bootstrap (toy ny kilasin'ny bokotra isan-karazany , ny sasany amin'ireo kaody manasongadina loko ampiasaina amin'ny sakana kaody fototra , ny kilasin'ny mpanampy ao .bg-primary
ambadika , ary ny lokon'ny rohy mahazatra rehefa ampiasaina amin'ny afara fotsy) manana tahan'ny fifanoherana ambany (eo ambanin'ny tahan'ny soso-kevitra 4.5: 1 ). Mety hiteraka olana ho an'ireo mpampiasa tsy mahita maso na jamba miloko izany. Mety mila ovaina ireo loko mahazatra ireo mba hampitomboana ny fifanoherana sy ny fahavakisan'izy ireo.
Bootstrap dia navoaka teo ambanin'ny lisansa MIT ary zon'ny mpamorona 2016 Twitter. Ampangotrahina hatramin'ny kely kokoa, dia azo faritana amin'ireto fepetra manaraka ireto.
Ny fahazoan-dàlana Bootstrap feno dia hita ao amin'ny tranokalan'ny tetikasa raha mila fanazavana fanampiny.
Nandika ny antontan-taratasin'i Bootstrap tamin'ny fiteny samihafa ny mpikambana ao amin'ny vondrom-piarahamonina. Tsy misy tohana amin'ny fomba ofisialy ary mety tsy ho tonga amin'ny daty foana.
Tsy manampy amin'ny fandaminana na fampiantranoana fandikan-teny izahay fa mampifandray azy ireo fotsiny.
Nahavita fandikan-teny vaovao na tsara kokoa? Sokafy ny fangatahana misintona mba hampidirana azy amin'ny lisitray.