Jalqabuu
Haala waliigalaa Bootstrap, akkaataa buufachuu fi itti fayyadamuu, unkaalee bu'uuraa fi fakkeenyota, fi kkf.
Haala waliigalaa Bootstrap, akkaataa buufachuu fi itti fayyadamuu, unkaalee bu'uuraa fi fakkeenyota, fi kkf.
Bootstrap (yeroo ammaa v3.3.7) karaalee salphaa muraasa dafanii jalqabuu danda'an qaba, tokkoon tokkoon isaanii sadarkaa ogummaa fi haala itti fayyadama adda addaa hawwatu. Fedhii addaa keessaniif maaltu akka mijatu ilaaluuf dubbisaa.
CSS, JavaScript, fi qubeewwan qindeessee fi xiqqaate. Docs ykn faayilii madda jalqabaa hin dabalamne.
Madda Xiqqaa, JaavaScript, fi faayiloota qubee, docs keenya waliin. Qindeessaa Less fi qindeessaa tokko tokko barbaada.
Bootstrap pirojektoota Rails, Compass, ykn Sass qofa keessatti salphaatti hammatamuuf Less irraa gara Sass tti jijjiirame.
Namoonni jsDelivr irratti argaman tolaan deeggarsa CDN Bootstrap's CSS fi JavaScript ni kennu. Hidhamtoota Bootstrap CDN kana qofa fayyadamaa .
Akkasumas Bootstrap's Less, CSS, JavaScript, fi qubeewwan Bower fayyadamuun fe'uu fi bulchuu dandeessa :
Bootstrap npm fayyadamuunis fe'uu dandeessu :
require('bootstrap')
ifteessitoota jQuery Bootstrap hunda wanta jQuery irratti ni fe'a. Moojulichi mataan bootstrap
isaa homaa hin ergu. /js/*.js
Faayilota galmee sadarkaa olaanaa paakeejii jalatti fe'uudhaan ifteessitoota jQuery Bootstrap dhuunfaan harkaan fe'uu dandeessa .
Bootstrap's package.json
furtuuwwan armaan gadii jalatti meetadaataa dabalataa tokko tokko of keessaa qaba:
less
- daandii gara faayilii madda Less guddaa Bootstrapstyle
- daandii gara CSS Bootstrap hin xiqqaafne kan qindaa'inoota durtii fayyadamuun dursee qindaa'e (dhuunfachiisuun hin jiru)Akkasumas Bootstrap's Less, CSS, JavaScript, fi qubeewwan Composer fayyadamuun fe'uu fi bulchuu dandeessa :
Bootstrap durtii gurguraa CSS ilaaluuf Autoprefixer fayyadama . Yoo Bootstrap madda isaa Less/Sass irraa qindeessaa jirta ta'ee fi Gruntfile keenya hin fayyadamne ta'e, Autoprefixer adeemsa ijaarsa kee keessatti ofuma keetii walitti makuu si barbaachisa. Yoo Bootstrap dursee qindaa'e fayyadamaa jirta ta'e ykn Gruntfile keenya fayyadamaa jirta ta'e, Autoprefixer duraan Gruntfile keenya keessatti waan walitti makameef waa'ee kanaa yaadda'uun si hin barbaachisu.
Bootstrap bifa lamaatiin buufamuu danda'a, isaan keessaa galmeewwanii fi faayiloota armaan gadii ni argattu, qabeenya waliigalaa loojikiidhaan garee gochuu fi garaagarummaa qindaa'ee fi xiqqaate lamaanuu kennuu.
Hubadhaa, ifteessitoonni JaavaScript hundi jQuery hammatamuu barbaadu, akkuma unkaa jalqabaa keessatti mul'atu . Gosoota jQuery kamtu akka deeggaramu ilaaluuf keenya ilaali .bower.json
Erga buufattee booda, caasaa (kan qindaa'e) Bootstrap ilaaluuf galmee dhiibame sana unzip godhi. Waan akkanaa ni argita:
Kun bifa Bootstrap isa hunda caalaa bu'uuraati: faayiloota dursanii qindaa'an fayyadama saffisaa kufaatii pirojektii weeb kamiyyuu keessatti jechuun ni danda'ama. CSS fi JS ( bootstrap.*
) qindaa'e, akkasumas CSS fi JS ( bootstrap.min.*
) qindaa'ee fi xiqqaate ni kennina. Kaartoonni madda CSS ( bootstrap.*.map
) meeshaalee guddiftuu biraawzaroota murtaa'oo wajjin fayyadamuuf ni argamu. Qubeewwan Glyphicons irraa hammatamaniiru, akkuma mata duree Bootstrap filannoo ta'e.
Buufanni koodii madda Bootstrap qabeenya CSS, JaavaScript, fi qubee dursee qindaa'e, madda Less, JavaScript, fi galmee waliin of keessatti qabata. Caalaatti ibsuuf, kanneen armaan gadii fi kanneen biroo of keessatti qabata:
, less/
, js/
fi fonts/
koodii madda qubee CSS, JS, fi mallattoo keenyaati (wal duraa duubaan). Galmeen sun dist/
waan kutaa buufannaa dursee qindaa'e armaan olitti tarreeffame hunda of keessatti qabata. Galmeen docs/
koodii madda galmee keenyaaf, fi examples/
kan fayyadama Bootstrap of keessatti qabata. Kana bira darbee, faayilii hammatame kan biraa kamiyyuu paakeejii, odeeffannoo hayyamaa, fi misoomaaf deeggarsa kenna.
Bootstrap sirna ijaarsa isaaf Grunt fayyadama , malawwan mijataa unkaa wajjin hojjechuuf. Akkaataa koodii keenya itti qindeessinu, qormaata itti gaggeessinu fi kkfti.
Grunt fe'uuf jalqaba node.js (kan npm of keessaa qabu) buufachuu fi fe'uu qabda. npm jechuun moojuulota node packaged jechuudha fi karaa hirkattummaa misoomaa karaa node.js bulchuuf gargaarudha.
Sana booda, sarara ajajaa irraa:grunt-cli
waliin akka addunyaatti fe'i npm install -g grunt-cli
./bootstrap/
, sana booda fiigi npm install
. npm package.json
faayilii ilaalee ofumaan hirkattummaa naannoo barbaachisoo achitti tarreeffaman ni fe'a.Yeroo xumuramu, ajajoota Grunt adda addaa sarara ajajaa irraa kennaman hojjechuu ni dandeessa.
grunt dist
(CSS fi JavaScript qofa qindeessuu)Galmee faayilii /dist/
CSS fi JaavaScript qindaa'ee fi xiqqaa ta'een irra deebi'ee uuma. Akka fayyadamaa Bootstrap tti, kun akka idileetti ajaja ati barbaaddudha.
grunt watch
(Ilaaluu)Faayilota madda Xiqqaa ilaalaa fi yeroo jijjiirama qusattu hunda ofumaan gara CSStti irra deebi'ee qindeessa.
grunt test
(Qorannoo fiigi) .JSHint hojjeta fi qormaata QUnit mataa malee PhantomJS keessatti hojjeta .
grunt docs
(Qabeenya docs ijaaruu & qorachuu)CSS, JavaScript, fi qabeenya biroo kan yeroo galmee naannootti karaa bundle exec jekyll serve
.
grunt
(Waan hundumaa guutummaatti ijaaraa fi qormaata fiigi)CSS fi JavaScript qindeessa fi xiqqeessa, marsariitii galmee ijaara, mirkaneessaa HTML5 docs irratti hojjeta, qabeenya Customizer deebisee uuma, fi kkf. Jekyll barbaada . Yeroo baayyee barbaachisaa kan ta'e yoo Bootstrap mataa isaa irratti hacking gootan qofa.
Yoo hirkattummaa fe'uu ykn ajajoota Grunt hojjechuu irratti rakkoon si mudate, jalqaba /node_modules/
galmee npm'n uumame haqi. Sana booda, irra deebiʼii fiigi npm install
.
Unkaa HTML bu'uuraa kanaan jalqabi, ykn fakkeenyota kana fooyyessi . Unkaalee fi fakkeenyota keenya akka barbaaddanitti akka madaqxan abdii qabna.
Galmee Bootstrap xiqqaa ta'een hojjechuu jalqabuuf HTML armaan gadii waraabi.
Unkaa bu'uuraa armaan olii irratti qaamolee hedduu Bootstrap waliin ijaari. Bootstrap fedhii pirojektii dhuunfaa keessanii wajjin akka walsimutti akka dhuunfattan fi akka madaqxan isin jajjabeessina.
Fakkeenya armaan gadii hundaaf koodii madda kuusaa Bootstrap buufachuudhaan argadhu . docs/examples/
Fakkeenyonni galmee keessatti argamuu danda'u .
Unkaa bu'uuraa ol'aanaa kan qabiyyee dabalataa tokko tokko waliin navbar of keessatti hammate.
Navbar amala hidhamtoota sirrii ta'an waliin uumi. Mataa ol qaba! Baay'ee Safarii michuu miti.
Bootlint meeshaaBootstrap HTML linter ofiisaa ti. Fuulota marsariitii Bootstrap fayyadamaa jiran keessatti dogoggora HTML beekamoo ta'an hedduu karaa madaalawaa "vanilla" ta'een ofumaan sakatta'a. Qaamonni/wiijetoota Vanilla Bootstrap kutaaleen isaanii DOM caasaa murtaa'e waliin akka walsimu barbaadu. Bootlint fakkeenyota qaamolee Bootstrap HTML sirritti caaseffame qabaachuu isaanii sakatta'a. Dogoggorri beekamoo ta'an tokkollee guddina pirojektii keetii akka hin saffisiifneef Bootlint gara Bootstrap web development toolchain kee irratti dabaluu yaadaa.
Misooma Bootstrap yeroo yeroon hordofaa fi qabeenya gargaaru kanaan hawaasa bira gahaa.
irc.freenode.net
sarvarii keessatti, ##bootstrap channel keessatti haasa'i .twitter-bootstrap-3
.bootstrap
raabsan dalagaa Bootstrap fooyyessanii ykn dabalan irratti fayyadamuu qabu argannoo guddaa argachuuf.Akkasumas oduu haaraa fi viidiyoo muuziqaa ajaa'ibaa argachuuf @getbootstrap Twitter irratti hordofuu dandeessu .
Bootstrap fuula keessan ofumaan guddina iskiriinii adda addaatiif madaqsa. Fuulli kee akka fakkeenya deebii hin kennine kanaatti akka hojjetu akkamitti amala kana hanqisuu dandeessu kunooti .
<meta>
keessatti caqafame dhiisiwidth
irratti irra darbi , fakkeenyaaf Kun Bootstrap CSS durtii booda akka dhufu mirkaneessi. Filannoodhaan gaaffiiwwan miidiyaa wajjin ykn filannoo-fu tokko tokko irraa fagaachuu dandeessa ..container
width: 970px !important;
!important
.col-xs-*
gitaalee dabalataan, ykn bakka, kanneen giddu galeessaa/guddaa fayyadami. Hin yaadda'inaa, giiriin meeshaa dabalataa xiqqaa ta'e gara furmaata hundaatti madaala.Ammas IE8'f Respond.js si barbaachisa (gaaffiin miidiyaa keenyaa ammallee waan jiruuf, adeemsifamuu waan qabuuf). Kunis "mobile site" gama Bootstrap hanqisa.
Tarkaanfiiwwan kana fakkeenyaaf hojiirra oolchineerra. Jijjiirama addaa hojiirra oole ilaaluuf koodii madda isaa dubbisi.
Bootstrap version durii irraa gara v3.x tti godaanuuf barbaadduu? Qajeelfama godaansaa keenya ilaalaa .
Bootstrap biraawzaroota deeskitooppii fi mobaayilaa haaraa keessatti akka gaariitti akka hojjetu ijaarameera, jechuunis biraawzaroota durii akkaataa adda addaatiin agarsiisuu danda'u, guutummaatti hojii qabaatus, agarsiisa qaamolee murtaa'oo.
Addatti ammoo, biraawzarootaa fi waltajjiiwwan armaan gadii kanneen haaraa ta’an ni deeggarra .
Biraawzaroota filannoo kanneen WebKit, Blink, ykn Gecko isa haaraa fayyadaman, kallattiinis ta'e karaa API ilaalcha weeb waltajjii, ifatti hin deeggaraman. Haa ta'u malee, Bootstrap (yeroo baay'ee) biraawzaroota kana keessattis sirritti agarsiisuu fi hojjechuu qaba. Odeeffannoon deeggarsa addaa dabalataa armaan gaditti kennameera.
Walumaagalatti, Bootstrap tokkoon tokkoon waltajjii guddaa biraawzaroota durtii gosoota haaraa ni deeggara. Hubadhaa, biraawzaroota bakka bu'aa (kan akka Opera Mini, haalata Turbo Opera Mobile, UC Browser Mini, Amazon Silk) akka hin deeggaramne.
Chrome jedhamuun beekama | Firefox jedhamuun beekama | Safarii | |
---|---|---|---|
Andirooyidii | Deeggarameera | Deeggarameera | N/A |
iOS jedhamuun beekama | Deeggarameera | Deeggarameera | Deeggarameera |
Haaluma walfakkaatuun, irra caalaan biraawzaroota deeskitooppii gosootni haaraan ni deeggaraman.
Chrome jedhamuun beekama | Firefox jedhamuun beekama | Internet Explorer jedhamuun beekama | Opera | Safarii | |
---|---|---|---|---|---|
Macaafa Qulqulluu | Deeggarameera | Deeggarameera | N/A | Deeggarameera | Deeggarameera |
Windows jedhamuun beekama | Deeggarameera | Deeggarameera | Deeggarameera | Deeggarameera | Hin deeggaramne |
Windows irratti, Internet Explorer 8-11 ni deeggarra .
Firefox tiif, gadhiifama tasgabbaa'aa idilee isa haaraatiin alatti, akkasumas gosa Firefox isa haaraa Gadhiifama Deeggarsa Dheeraa (ESR) ni deeggarra.
Akka ofiisaatti, Bootstrap Chromium fi Chrome for Linux, Firefox for Linux, fi Internet Explorer 7, akkasumas Microsoft Edge keessatti akka gaariitti ilaaluu fi amala qabaachuu qaba, haa ta'u malee isaan ifatti hin deeggaramne.
Tarree dogongora biraawzarii Bootstrap waliin wal'aansoo qabuu qabu tokko tokkoof, Wall of browser bugs keenya ilaali .
Internet Explorer 8 fi 9 akkasumas ni deeggaramu, haa ta'u malee, maaloo qabeentota CSS3 tokko tokko fi elementoonni HTML5 guutummaatti biraawzaroota kanaan akka hin deeggaramne beekaa. Dabalataanis, Internet Explorer 8 deeggarsa gaaffii miidiyaa dandeessisuuf Respond.js fayyadamuu barbaada.
Amala | Intarneetii Eksploorarii 8. | Intarneetii Eksploorarii 9. |
---|---|---|
border-radius |
Hin deeggaramne | Deeggarameera |
box-shadow |
Hin deeggaramne | Deeggarameera |
transform |
Hin deeggaramne | Deeggaraman, -ms durtii waliin |
transition |
Hin deeggaramne | |
placeholder |
Hin deeggaramne |
Deeggarsa biraawzari amaloota CSS3 fi HTML5 bal'inaan argachuuf Can I use... daawwadhu .
Yeroo Respond.js naannoo misoomaa fi oomishaa keessan Internet Explorer 8 keessatti fayyadamtan of eeggannoowwan armaan gadii irraa of eeggadhaa.
Respond.js CSS domeenii adda addaa (sub) irratti keessummeefame waliin fayyadamuun (fakkeenyaaf, CDN irratti) qindeessaa dabalataa tokko tokko barbaada. Bal'ina isaaf docs Respond.js ilaali .
file://
Sababa seera nageenya biraawzariin, Respond.js fuula karaa pirootokoolii ilaalaman waliin hin hojjetu file://
(akka yeroo faayilii HTML naannoo banu). IE8 keessatti amaloota deebii kennan qorachuuf, fuula kee HTTP(S) irratti ilaali. Bal'ina isaaf docs Respond.js ilaali .
@import
Respond.js CSS karaa @import
. Keessattuu, qindeessootni Drupal tokko tokko akka fayyadaman beekamaadha @import
. Bal'ina isaaf docs Respond.js ilaali .
IE8 yeroo , , , ykn box-sizing: border-box;
waliin walitti makamu guutummaatti hin deeggaru . Sababa sanaaf, v3.0.1 irraa eegalee, kana booda s irratti hin fayyadamnu.min-width
max-width
min-height
max-height
max-width
.container
@font-face
IE8 yeroo waliin walitti makamu dhimmoota tokko tokko qaba :before
. Bootstrap walnyaatinsa sana Glyphicons isaa waliin fayyadama. Yoo fuul-barruun tokko kaa'ame, fi hantuutee malee foddaa irratti fe'ame (jechuunis qaree haaromsaa rukuti ykn iframe keessatti waan tokko fe'i) sana booda fuul-barruun osoo qubee hin fe'iin dura agarsiifama. Fuula (qaama) irratti olkaasuun mallattoolee tokko tokko agarsiisaa fi mallattoolee hafan irratti olkaasuun warra sanas agarsiisa. Bal'ina isaaf lakkofsa #13863 ilaali .
Bootstrap haalata walsimsiisaa Internet Explorer durii keessatti hin deeggaramu. Haalata agarsiisaa isa haaraa IEf fayyadamaa akka jirtu mirkaneeffachuuf, <meta>
mallattoo sirrii fuula kee keessatti hammachuu yaadaa:
Meeshaalee sirreeffama banuun haalata galmee mirkaneessi: dhiibiitii F12"Haalata Galmee" ilaali.
Mallattoon kun galmeewwanii fi fakkeenyota Bootstrap hunda keessatti hammatamee tokkoon tokkoon gosa Internet Explorer deeggaramee keessatti agarsiisa gaarii ta'e mirkaneessuuf.
Odeeffannoo dabalataaf gaaffii StackOverflow kana ilaali .
Internet Explorer 10 bal'ina meeshaa bal'ina buufata ilaalchaa irraa adda hin baasu , kanaaf gaaffiiwwan miidiyaa Bootstrap's CSS keessatti sirnaan hin hojiirra oolchu. Akka idileetti kana sirreessuuf CSS saffisaa qofa itti dabalta:
Haa ta'u malee, kun meeshaalee Windows Phone 8 versions Update 3 (aka GDR3) caalaa dullooman hojjetaniif hin hojjetu , sababiin isaas meeshaaleen akkasii ilaalcha dhiphoo "bilbila" osoo hin taane irra caalaa ilaalcha desktop akka agarsiisan waan taasisuuf. Kana furuuf, dogongora sana irra darbuuf CSS fi JavaScript armaan gadii hammachuu qabda .
Odeeffannoo dabalataa fi qajeelfama itti fayyadamaaf, Windows Phone 8 fi Device-Width dubbisi .
Akka heads up tti, kana galmee fi fakkeenyota Bootstrap hunda keessatti akka agarsiisaatti hammachina.
Motorri agarsiisaa versions Safari duraa v7.1 for OS X fi Safari for iOS v8.0 lakkoofsa iddoowwan kurnyee .col-*-1
gita giiridii keenya keessatti fayyadaman irratti rakkina tokko tokko qaba ture. Kanaafuu osoo tarjaawwan tarjaa dhuunfaa 12 qabaattee, tarreewwan tarjaawwan biroo wajjin wal bira qabamee yoo ilaalamu gabaabsee akka dhufan hubatta. Safari/iOS fooyyessuu bira darbee, furmaata tokko tokko qabda:
.pull-right
Hiriirsa jabaa-mirgaa argachuuf tarjaa tarjaa kee isa dhumaa irratti dabaliDeeggarsi overflow: hidden
on the <body>
element iOS fi Android keessatti baayyee daangeffamaadha. Kanaaf, yeroo ati gubbaa ykn jala moodaalii biraawzaroota meeshaalee sanaa keessaa tokko bira darbitu, <body>
qabiyyeen sun garagalchuu ni jalqaba. Dogoggora Chrome #175502 ( Chrome v40 keessatti sirreeffame) fi dogongora WebKit #153852 ilaali .
IOS 9.3 irraa eegalee, moodaaliin tokko banaa ta'ee osoo jiruu, yoo tuqaan jalqabaa sochii qaxxaamuraa daangaa barreeffamaa <input>
ykn a keessa jiraate <textarea>
, <body>
qabiyyeen moodaalichaa jala jiru bakka moodaalichaa ofii isaatii ni qaxxaamurama. Dogoggora WebKit #153856 ilaali .
Akkasumas, hubadhu yoo navbar dhaabbataa fayyadamaa jirta ta'e ykn galtee moodaalii keessaa fayyadamaa jirta ta'e, iOS dogongora agarsiisaa kan yeroo kiiboordii dhugaa kaka'u bakka elementoota dhaabbataa hin haaromsine qaba. Kanaaf furmaata muraasni elementoota kee gara position: absolute
ykn sa'aatii xiyyeeffannoo irratti waamuun iddoo harkaan sirreessuuf yaaluun dabalata. Kun Bootstrap'n hin qabamu, kanaaf furmaata kamtu application keessaniif gaarii akka ta'e murteessuu kan keessan ta'a.
Elementiin .dropdown-backdrop
kun iOS irratti nav keessatti hin fayyadamu sababa walxaxiinsa z-indexing irraa kan ka'e. Kanaaf, navbars keessatti tarreewwan cufuuf, kallattiin elementii gadi bu'aa cuqaasuu qabda (ykn elementii biraa kamiyyuu kan taatee cuqaasuu iOS keessatti dhukaasu ).
Fuula guddisuun qaamolee tokko tokko keessatti artifaaktii agarsiisaa dhiyeessuun waan hin oolle, Bootstrap fi weeb hafe keessatti. Dhimmicha irratti hundaa'uun sirreessuu dandeenya ta'a (dursa barbaadi sana booda yoo barbaachisaa ta'e dhimma tokko banaa). Haa ta’u malee, yeroo baay’ee furmaata kallatti hacky workarounds malee waan hin qabneef kanneen bira darbuuf carraaqna.
:hover
/ :focus
mobaayila irrattiHovering dhugaa irra caalaan touchscreens irratti kan hin danda'amne ta'us, irra caalaan browser browsers deeggarsa hovering fakkeessuun :hover
"sticky" godhu. Jecha biraatiin, :hover
akkaataaleen erga elementii tokko tuqee booda hojii irra oolchuu kan jalqaban yoo ta'u, erga fayyadamaan elementii biraa tokko tokko tuqee booda qofa hojii irra oolchuu dhaabu. Kunis :hover
haalawwan Bootstrap akka hin barbaadamnetti "stuck" ta'an browser akkasii irratti taasisuu danda'a. Browseroonni moobaayilaa tokko tokkos :focus
haala walfakkaatuun maxxanuu ni godhu. Yeroo ammaa dhimmoota kanaaf furmaanni salphaan akkaataa akkasii guutummaatti haquu malee hin jiru.
Biraawzaroota ammayyaa tokko tokko keessattillee maxxansuun quirky ta'uu danda'a.
Keessattuu, Chrome v32 irraa eegalee fi qindaa'inoota margina osoo hin ilaalin, Chrome yeroo fuula marsariitii maxxansu gaaffii miidiyaa furu bal'ina viewport guddina waraqaa fiizikaalaa caalaa baay'ee dhiphoo ta'e fayyadama. Kunis yeroo maxxansuu tarjaa xiqqaa dabalataa Bootstrap osoo hin eegin akka hojiirra oolu taasisuu danda'a. Bal'ina tokko tokkoof dhimma #12078 fi Chrome bug #273306 ilaali. Furmaata yaadame:
@screen-*
Waraqaan maxxansaa kee akka dabalataa-xiqqaa caalaa guddaa ta'etti akka ilaalamu gatiiwwan jijjiiramoota Xiqqaa dhuunfachiisi .Akkasumas, akka Safari v8.0, fixed-width .container
s Safari yeroo maxxansu hammangaa qubee xiqqaa hin baratamne akka fayyadamu gochuu danda'a. Bal'ina isaaf #14868 fi dogongora WebKit #138192 ilaali. Kanaaf furmaanni ta'uu danda'u tokko CSS armaan gadii dabaluudha:
Sanduuqa keessaa ba'ee, Android 4.1 (fi illee kanneen haaraa gadhiifaman tokko tokko fakkaata) appii Browser waliin akka filannoo web browser durtii (faallaa Chrome) waliin ergama. Kan nama dhibu, appiin Browser bugs baay'ee fi walumaa galatti CSS waliin wal hin simne qaba.
Elementiiwwan irratti <select>
, biraawzariin istookii Andirooyidii yoo jiraate border-radius
fi/ykn border
hojiirra oole to'annoo cinaa hin agarsiisu. ( Bal'ina isaaf gaaffii StackOverflow kana<select>
ilaali.) CSS nama mufachiisu haquuf fi akka elementii unstyled ta'etti Android stock browser irratti agarsiisuuf cuqqaa koodii armaan gadii fayyadami . Urgaa'uun bakka bu'aa fayyadamaa Chrome, Safari, fi Mozilla browsers gidduu seenuun ni hambisa.
Fakkeenya arguu barbaadduu? Demo JS Bin kana ilaalaa.
Muuxannoo gaarii biraawzaroota durii fi dogoggora qabaniif kennuudhaaf, Bootstrap bakka hedduutti hack biraawzari CSS fayyadamuun CSS addaa gara gosoota biraawzaroota murtaa'anitti xiyyeeffachuun dogoggora biraawzaroota keessa jiran ofuma isaaniitii irratti hojjechuuf. Hacks kunniin CSS validators sirrii miti jedhanii akka komatan gochuun isaanii hubatamaadha. Bakka lamatti, akkasumas amaloota CSS dhiiguu-qarqara ammallee guutummaatti sadarkaa hin qabne fayyadamna, garuu kunniin fooyya'iinsa tarkaanfataadhaaf qulqulluu ta'ee fayyadamu.
Akeekkachiisni mirkaneessuu kun qabatamaan dhimma hin qaban sababiin isaas kutaan CSS keenyaa inni hacky hin taane guutummaatti mirkaneessaa fi kutaaleen hacky kutaa hacky hin taane sirnaan hojjechuu waan hin gufachiifneef, kanarraa ka'uun maaliif itti yaadnee akeekkachiisa addaa kana tuffannu.
Barreeffamoonni HTML keenyas akkasuma sababa dogoggora Firefox murtaa'eef furmaata hammachuu keenyaatiin akeekkachiisa mirkaneessuu HTML salphaa fi bu'aa hin qabne tokko tokko qabu .
Ilaginoota qaama sadaffaa ykn dabalataa kamiyyuu ifatti kan hin deeggarre ta'us, pirojektoota keessan keessatti dhimmoota mudachuu danda'an hambisuuf gargaaruuf gorsa faayidaa qabu tokko tokko ni kennina.
Software qaama sadaffaa tokko tokko, Google Maps fi Google Custom Search Engine dabalatee, Bootstrap waliin waldhaban sababa * { box-sizing: border-box; }
, seera akkas padding
godhu bal'ina shallagame dhumaa elementii tokkoo irratti dhiibbaa hin qabu. Waa'ee moodeela saanduqaa fi safara CSS Tricks irratti caalaatti baradhu .
Haalata irratti hundaa'uun, akka barbaachisummaa isaatti irra darbuu dandeessa (Filannoo 1) ykn safara saanduqa naannoolee guutuuf deebisanii saaguu dandeessa (Filannoo 2).
Bootstrap istaandaardii weeb waliigalaa hordofa fi—tattaaffii dabalataa xiqqaadhaan—saayitoota warra AT fayyadamaniif dhaqqabamaa ta’an uumuuf itti fayyadamuun ni danda’ama .
Yoo navigeeshiniin kee hidhannoo hedduu of keessaa qabuu fi qabiyyee ijoo DOM keessa jiru dura dhufe, Skip to main content
navigeeshinii dura hidhaa dabali (ibsa salphaadhaaf, barruu Pirojektii A11Y kana hidhannoo navigeeshinii darbuu ilaali ). Gitaa fayyadamuun .sr-only
hidhaa darbuu mul'ataan ni dhoksa, fi .sr-only-focusable
gitaan hidhaan al tokko xiyyeeffate akka mul'atu ni mirkaneessa (fayyadamtoota kiiboordii ijaa qabaniif).
Sababa hanqina/dogoggora yeroo dheeraa Chrome keessatti ( dhimma 262171 Chromium bug tracker keessatti ilaali ) fi Internet Explorer (barruu kana ilaali hidhaa fuula keessaa fi tartiiba xiyyeeffannoo ), galma hidhaa darbuu keetii mirkaneeffachuu si barbaachisa yoo xiqqaate sagantaadhaan xiyyeeffachuu kan danda'u yoo ta'u itti dabaluudhaan tabindex="-1"
.
Dabalataanis, agarsiisa xiyyeeffannoo mul'atu galma irratti ifatti ukkaamsuu barbaadda ta'a (keessattuu akka Chrome yeroo ammaa akkasumas xiyyeeffannoo elementoota irratti tabindex="-1"
yeroo hantuuteedhaan cuqaafaman waliin saaga) waliin #content:focus { outline: none; }
.
Hubadhu, dogongorri kun hidhannoo fuula keessaa biroo marsariitiin kee fayyadamuu danda'u kamiyyuu irrattis dhiibbaa akka qabu, fayyadamtoota kiiboordiidhaaf faayidaa akka hin qabne taasisa. Sirreeffama qaawwa dhaabbii walfakkaataa anchors / adda baastoota ciccitaa maqaa qaban kanneen akka galma walqabsiisaa hojjetan hunda irratti dabaluu yaaduu dandeessa.
Yeroo mataduree ( <h1>
- <h6>
) man'eessu, mataduree galmee kee inni jalqabaa <h1>
. Mata dureewwan itti aanan loojikiidhaan fayyadamuu qabu <h2>
- <h6>
akka dubbistoonni iskiriinii gabatee qabiyyee fuula keetiif ijaaruu danda'anitti.
HTML CodeSniffer fi Penn State's AccessAbility irraa caalaatti baradhu .
Yeroo ammaa, walnyaatinsa halluu durtii Bootstrap keessatti argaman tokko tokko (kan akka gita qaree akkaataa adda addaa , halluuwwan calaqqisiisoo koodii tokko tokko uggura koodii bu'uuraatiif fayyadaman , gita gargaaraa .bg-primary
duubbee haalata , fi halluu hidhaa durtii yeroo duubbee adii irratti fayyadamtu) reeshiyoo walfaallaa gadi aanaa qabu ( reeshiyoo gorfame 4.5:1 gadi ). Kunis fayyadamtoota ijaan arguu gadi aanaa qaban ykn halluu hin qabne irratti rakkoo fiduu danda’a. Halluuwwan durtii kun walfaallaa fi dubbifamuu isaanii guddisuuf fooyya'uu barbaachisuu danda'a.
Bootstrap hayyama MIT jalatti kan gadhiifame yoo ta'u, mirga waraabbii 2016 Twitter qaba. Gara xixiqqootti yoo bilcheefame, haalawwan armaan gadiitiin ibsamuu danda’a.
Hayyamni Bootstrap guutuun odeeffannoo dabalataaf kuusaa pirojektii keessatti argama.
Miseensonni hawaasaa galmee Bootstrap gara afaanota adda addaatti hiikaniiru. Tokkollee akka ofiisaatti kan deeggaramee fi yeroo hunda yeroo isaa eeggate ta’uu dhiisuu danda’a.
Hiikkaa qindeessuuf ykn keessummeessuuf hin gargaarru, isaan qofa link goona.
Hiikkaa haaraa ykn fooyya'aa ta'e xumurtee? Tarree keenyatti dabaluudhaaf gaaffii harkisaa bani.