Bilaabayaa
Dulmar guud oo ku saabsan Bootstrap, sida loo soo dejiyo oo loo isticmaalo, moodooyinka aasaasiga ah iyo tusaalooyinka, iyo in ka badan.
Dulmar guud oo ku saabsan Bootstrap, sida loo soo dejiyo oo loo isticmaalo, moodooyinka aasaasiga ah iyo tusaalooyinka, iyo in ka badan.
Bootstrap (hadda v3.3.7) waxay leedahay dhowr siyaabood oo fudud oo si degdeg ah loo bilaabo, mid kastaa wuxuu soo jiidanayaa heer xirfadeed oo kala duwan iyo kiis isticmaal. Akhri si aad u aragto waxa ku habboon baahiyahaaga gaarka ah.
CSS, JavaScript, iyo xarfaha la ururiyey oo la yareeyey. Ma jiro dokumentiyo ama faylal asal ah oo lagu daray
Isha ka yar, JavaScript, iyo faylalka farta, oo ay la socdaan dokumeentiyadayada. Wuxuu u baahan yahay iskuduwe ka yar iyo habayn.
Bootstrap laga soo xawilay ka yar ilaa Sass si fudud loogu daro mashaariicda tareenada, Compass, ama Sass-keliya.
Dadka jooga jsDelivr waxay si naxariis leh u bixiyaan taageerada CDN ee Bootstrap's CSS iyo JavaScript. Kaliya adeegso xiriiriyeyaashan Bootstrap CDN
Waxa kale oo aad ku rakibi kartaa oo maamuli kartaa Bootstrap's Less, CSS, JavaScript, iyo fonts addoo isticmaalaya Bower :
Waxa kale oo aad ku rakibi kartaa Bootstrap adoo isticmaalaya npm :
require('bootstrap')
waxay ku shubi doontaa dhammaan Bootstrap's jQuery plugins-ka shayga jQuery. moduleka bootstrap
laftiisa waxba ma dhoofiyo. Waxaad si gaar ah ugu shuban kartaa Bootstrap's jQuery plugins adiga oo ku shubaya /js/*.js
faylalka hoos yimaada hagaha heerka sare ee xirmada.
Bootstrap's package.json
wuxuu ka kooban yahay xog badan oo dheeraad ah oo hoos yimaada furayaasha soo socda:
less
- Jidka loo maro Bootstrap's faylka isha ka yarstyle
- Jidka loo maro Bootstrap's CSS-ka aan la yarayn ee horay loo soo ururiyay iyadoo la adeegsanayo jaangooyooyinka caadiga ah (wax habayn lahayn)Waxa kale oo aad ku rakibi kartaa oo maamuli kartaa Bootstrap's Less, CSS, JavaScript, iyo fonts adoo isticmaalaya laxanka :
Bootstrap wuxuu adeegsadaa Autoprefixer si uu ula tacaalo horgalayaasha CSS . Haddii aad Bootstrap ka ururinayso isha ka yar/Sass oo aanad isticmaalin Gruntfile-kayaga, waxaad u baahan doontaa inaad laftaadu ku dhex darto Autoprefixer habka dhismahaaga. Haddii aad isticmaalayso Bootstrap-ka hore ama aad isticmaalayso Gruntfile-kayaga, uma baahnid inaad ka walwasho tan sababtoo ah Autoprefixer ayaa mar horeba lagu dhex daray Gruntfile.
Bootstrap waxaa lagu soo dejisan karaa laba qaab, taas oo aad ka heli doonto hagayaasha soo socda iyo faylalka, si macquul ah u kooxaynta agabyada guud oo bixisa kala duwanaansho la soo ururiyey iyo kuwa la yareeyey.
Fadlan ogow in dhammaan plugins-yada JavaScript ay u baahan yihiin in jQuery lagu daro, sida ku cad qaabka bilowga ah . Kala tashobower.json
si aad u aragto noocyada jQuery ee la taageeray.
Marka la soo dejiyo, fur galka la isku riixay si aad u aragto qaab-dhismeedka (kuwa la isku duba riday) Bootstrap Waxaad arki doontaa wax sidan oo kale ah:
Kani waa qaabka ugu aasaasiga ah ee Bootstrap: faylalka horay loo soo diyaariyay ee isticmaalka degdega ah ee ku dhawaad mashruuc kasta oo shabakad ah. Waxaan bixinaa CSS iyo JS ( bootstrap.*
), iyo sidoo kale CSS la soo ururiyey oo la yareeyey iyo JS ( bootstrap.min.*
). Khariidadaha isha CSS ( bootstrap.*.map
) ayaa diyaar u ah in lagu isticmaalo daalacashada qalabyada horumariyaha qaarkood. Farta ka socota Glyphicons ayaa lagu soo daray, sidoo kale mawduuca Bootstrap ee ikhtiyaarka ah.
Soo dejinta koodhka isha Bootstrap waxaa ku jira CSS-da la sii diyaariyay, JavaScript, iyo hantida farta, oo ay la socoto isha ka yar, JavaScript, iyo dukumentiyada. Si gaar ah, waxa ka mid ah kuwan soo socda iyo in ka badan:
The less/
, js/
, iyo fonts/
waa furaha isha ee CSS, JS, iyo astaanta (sida ay u kala horreeyaan). Galka dist/
waxa ku jira wax kasta oo ku taxan qaybta hore loo soo dejiyey ee sare. Galka docs/
waxaa ku jira summada isha ee dukumeentigeena, iyo examples/
isticmaalka Bootstrap. Intaa ka sokow, fayl kasta oo lagu soo daray wuxuu bixiyaa taageerada xirmooyinka, macluumaadka shatiga, iyo horumarinta.
Bootstrap waxay u isticmaashaa Grunt nidaamkeeda dhismaheeda, oo leh habab ku habboon in lagu shaqeeyo qaabka. Waa sida aan u ururinno koodkayaga, u wadno imtixaannada, iyo in ka badan.
Si aad u rakibto Grunt, waa inaad marka hore soo dejisaa oo aad rakibtaa node.js (oo ay ku jirto npm). npm waxay u taagan tahay unugyo baakadaysan oo node ah waana hab lagu maareeyo ku tiirsanaanta horumarka iyada oo loo marayo node.js.
Ka dib, ka bilow khadka taliska:grunt-cli
caalami ahaan npm install -g grunt-cli
./bootstrap/
, ka dibna orod npm install
. npm waxay eegi doontaa package.json
faylka oo si toos ah u rakibi doona ku-tiirsanaanta lama huraanka ah ee meeshaas ku qoran.Marka la dhammeeyo, waxaad awoodi doontaa inaad socodsiiso amarrada kala duwan ee Grunt ee laga bixiyo khadka taliska.
grunt dist
(Kaliya soo ururi CSS iyo JavaScript)Wuxuu dib u /dist/
soo nooleeyaa tusaha isagoo wata faylal CSS iyo JavaScript la ururiyey oo la yareeyey. Isticmaale Bootstrap ahaan, kani caadiyan waa amarka aad rabto.
grunt watch
(Daawo)Wuxuu daawadaa il-yaraha faylalka oo si toos ah ugu ururiyaa CSS mar kasta oo aad kaydiso isbeddel.
grunt test
(Orod imtixaanada)Wuxuu wadaa JSHint oo wuxuu si madax la'aan ah u wadaa imtixaanada QUnit gudaha PhantomJS .
grunt docs
(dhiso oo tijaabi hantida dukumeentiyada)Wuxuu dhisaa oo tijaabiyaa CSS, JavaScript, iyo hantida kale ee la isticmaalo marka dukumentiga lagu socodsiinayo gudaha bundle exec jekyll serve
.
grunt
(Gabi ahaanba wax walba dhis oo tijaabi imtixaanada)Wuxuu ururiyaa oo yareeyaa CSS iyo JavaScript, wuxuu dhisaa bogga dukumeentiyada, wuxuu maamulaa ansaxiyaha HTML5 ka soo horjeeda dukumeentiyada, dib u soo nooleynta hantida Customizer, iyo in ka badan. Wuxuu u baahan yahay Jekyll . Caadi ahaan waa lagama maarmaan kaliya haddii aad jabsanayso Bootstrap lafteeda.
Haddii aad la kulanto dhibaatooyin ku saabsan rakibidda ku-tiirsanaanta ama socodsiinta amarrada Grunt, marka hore tirtir /node_modules/
tusaha ay soo saartay npm. Kadibna, ku celi npm install
.
Ka bilow template HTML ee aasaasiga ah, ama wax ka beddel tusaalahan . Waxaan rajaynaynaa inaad habayn doonto qaab-dhismeedkayada iyo tusaalayaashayada, adigoo ku habaynaya si ay ugu habboonaadaan baahiyahaaga.
Koobi HTML-ka hoose si aad u bilowdo ku shaqaynta dukumeenti Bootstrap ugu yar.
Ku dhis qaabka aasaasiga ah ee kore oo leh qaybaha badan ee Bootstrap. Waxaanu kugu dhiirigelinaynaa inaad habayso oo aad la qabsato Bootstrap si uu u waafajiyo baahiyaha mashruucaaga gaarka ah.
Hel koodka isha tusaale kasta oo hoose adiga oo soo dejinaya kaydka Bootstrap . Tusaalooyinka waxaa laga heli karaa docs/examples/
hagaha.
Ma jiro wax aan ahayn aasaaska: CSS la soo ururiyey iyo JavaScript oo ay weheliso weel.
Ku dheji mawduuca Bootstrap ee ikhtiyaarka ah ee waayo-aragnimada muuqaal ahaan loo xoojiyay.
Qaabka aasaasiga ah ee ugu sarreeya oo ay ku jiraan navbar-ka oo ay la socdaan waxyaabo dheeraad ah.
Samee navbar gaar ah oo leh xiriiriyeyaal xaq ah. Madaxa kor u qaad! Ma aha mid aad u saaxiibtinimo Safari.
Bootlint waa aaladda rasmiga ah ee Bootstrap HTML. Waxay si toos ah u hubisaa dhowr qalad oo HTML ah oo ku jira boggaga internetka kuwaas oo u isticmaalaya Bootstrap si cadaalad ah "vanilla". Qaybaha Vanilla Bootstrap's/widgets waxay u baahan yihiin qaybahooda DOM si ay ugu hoggaansamaan qaababka qaarkood. Bootlint waxay hubisaa in tusaalooyinka qaybaha Bootstrap ay si sax ah u habeeyeen HTML. Tixgeli inaad ku darto Bootlint qalabkaaga horumarinta shabakada Bootstrap si aanay khaladaadka caadiga ah midkoodna u dhimin horumarka mashruucaaga.
La soco wixii ku saabsan horumarinta Bootstrap oo la xiriir bulshada agabkan waxtarka leh.
irc.freenode.net
server-ka, gudaha kanaalka ##bootstrap .twitter-bootstrap-3
.bootstrap
ee xirmooyinka wax ka beddelaya ama ku dara shaqada Bootstrap marka loo qaybinayo npm ama hababka gudbinta la midka ah si loo helo ugu badnaan.Waxaad sidoo kale kala socon kartaa @getbootstrap Twitter- ka xanta ugu dambeysay iyo muuqaalada muusiga ee cajiibka ah.
Bootstrap wuxuu si toos ah ugu habeeyaa boggaga cabbirrada shaashadaha kala duwan. Waa kan sida loo damiyo sifadan si boggaagu u shaqeeyo sida tusaalahan aan jawaab-celinta lahayn .
<meta>
lagu sheegay dukumeentiyada CSSwidth
ku yaal .container
heer-beero kasta oo leh hal balac, tusaale ahaan width: 970px !important;
Hubi in tani ay timaaddo Bootstrap-ka caadiga ah ee CSS. Waxaad si ikhtiyaar ah uga fogaan kartaa !important
su'aalaha warbaahinta ama qaar ka mid ah xulashada-fu..col-xs-*
fasallada ka sokow, ama meesha, kuwa dhexe/weyn. Ha werwerin, qalabka yar-yar ee dheeraadka ah ayaa cabbiraya dhammaan xallinta.Waxaad weli u baahan doontaa Respond.js ee IE8 (maadaama su'aalahayaga warbaahintu ay weli jiraan oo ay u baahan yihiin in la habeeyo). Tani waxay curyaamisaa "goobta mobilada" dhinacyada Bootstrap.
Tillaabooyinkan waxaan ku dabaqnay tusaale. Akhri koodka isha si aad u aragto isbeddelada gaarka ah ee la fuliyay.
Ma waxaad raadineysaa inaad ka haajirto noocii hore ee Bootstrap una guuri v3.x? Fiiri hagaha socdaalka .
Bootstrap waxaa loo dhisay inuu si wanaagsan ugu shaqeeyo Desktop-kii ugu dambeeyay iyo daalacashada mobilada, taasoo la micno ah daalacashada hore ayaa laga yaabaa inay soo bandhigaan qaab kala duwan, inkastoo ay si buuxda u shaqeynayaan, muujinta qaybaha qaarkood.
Gaar ahaan, waxaanu taageernaa noocyadii ugu dambeeyay ee daalacashada iyo aaladaha soo socda.
Daalacashada beddelka ah ee adeegsata noocii ugu dambeeyay ee WebKit, Blink, ama Gecko, ha ahaato si toos ah ama ha ahaato goobta muuqaalka shabakadda API, si cad looma taageero. Si kastaba ha ahaatee, Bootstrap waa in (xaaladaha intooda badan) ay si sax ah u soo bandhigaan oo si sax ah ugu shaqeeyaan daalacashadan sidoo kale. Macluumaad dheeri ah oo gaar ah ayaa lagu bixiyaa hoosta.
Guud ahaan, Bootstrap waxay taageertaa noocyadii ugu dambeeyay ee madal kasta oo daalacashada caadiga ah. Ogow in browsers-yada wakiillada ah (sida Opera Mini, Opera Mobile's Turbo mode, UC Browser Mini, Amazon Silk) aan la taageerin.
Chrome | Firefox | Safari | |
---|---|---|---|
Android | Taageeray | Taageeray | N/A |
IOS | Taageeray | Taageeray | Taageeray |
Sidoo kale, noocyadii ugu dambeeyay ee inta badan daalacashada desktop-ka waa la taageerayaa.
Chrome | Firefox | Internet Explorer | Opera | Safari | |
---|---|---|---|---|---|
Mac | Taageeray | Taageeray | N/A | Taageeray | Taageeray |
Daaqadaha | Taageeray | Taageeray | Taageeray | Taageeray | Lama taageero |
Daaqadaha, waxaan taageernaa Internet Explorer 8-11 .
Firefox, marka lagu daro sii dayntii ugu dambeysay ee xasilloonida, waxaan sidoo kale taageernaa sii deynta Taageerada Dheeraadka ah ee ugu dambeysay (ESR) ee Firefox.
Si aan rasmi ahayn, Bootstrap waa inuu si fiican ugu dhaqmaa Chromium iyo Chrome ee Linux, Firefox for Linux, iyo Internet Explorer 7, iyo sidoo kale Microsoft Edge, in kasta oo aan si rasmi ah loo taageerin.
Liisaska qaar ka mid ah cilladaha browserka ee Bootstrap ay tahay in uu la tacaalo, arag darbigayaga kutaannada browserka .
Internet Explorer 8 iyo 9 sidoo kale waa la taageerayaa, si kastaba ha ahaatee, fadlan la soco in qaar ka mid ah guryaha CSS3 iyo HTML5 aysan si buuxda u taageerin daalacashadan. Intaa waxaa dheer, Internet Explorer 8 waxay u baahan tahay isticmaalka Respond.js si ay awood ugu siiso taageerada weydiinta warbaahinta.
Muuqaal | Internet Explorer 8 | Internet Explorer 9 |
---|---|---|
border-radius |
Lama taageero | Taageeray |
box-shadow |
Lama taageero | Taageeray |
transform |
Lama taageero | Lagu taageeray, -ms horgale leh |
transition |
Lama taageero | |
placeholder |
Lama taageero |
Booqo Ma isticmaali karaa... faahfaahinta taageerada browserka ee sifooyinka CSS3 iyo HTML5.
Ka digtoonow digniinaha soo socda markaad Respond.js u isticmaalayso horumarkaaga iyo deegaankaaga wax soo saarka ee Internet Explorer 8.
Isticmaalka Respond.js ee leh CSS oo lagu hayo meel (sub) ka duwan (tusaale, CDN) waxay u baahan tahay habayn dheeraad ah. Faahfaahinta ka eeg dukumeentiyada Respond.js
file://
Shuruucda amniga browserka awgeed, Respond.js kuma shaqeyso boggaga lagu arko file://
hab-maamuuska (sida marka la furayo faylka HTML maxalli ah). Si aad u tijaabiso sifooyinka ka jawaabaya gudaha IE8, ka eeg boggaga HTTP(S). Faahfaahinta ka eeg dukumeentiyada Respond.js
@import
Respond.js kuma shaqeyso CSS ee lagu tixraacayo @import
. Gaar ahaan, qaar ka mid ah qaababka Drupal ayaa loo yaqaan inay isticmaalaan @import
. Faahfaahinta ka eeg dukumeentiyada Respond.js
IE8 si buuxda uma taageero box-sizing: border-box;
marka lagu daro min-width
, max-width
, min-height
, ama max-height
. Sababtaas awgeed, laga bilaabo v3.0.1, hadda ma isticmaalno max-width
s .container
.
IE8 waxay leedahay arrimo qaarkood @font-face
marka lagu daro :before
. Bootstrap waxay isticmaashaa isku dhafkaas Glyphicons. Haddii bog la kaydiyo, oo lagu shubo mouse-ka oo aan la dul marin daaqadda (tusaale ku dhufo badhanka dib u soo kicinta ama wax ku shub iframe) markaas bogga waxa la sameeyay ka hor inta aanay fartu soo degin. Ku dul boodista bogga (jidhka) waxay tusi doontaa qaar ka mid ah calaamadaha oo ku dul boodboodka calaamadaha soo hadhay waxay tusi doontaa kuwa sidoo kale. Faahfaahinta ka eeg tirsiga #13863 .
Bootstrap laguma taageero qaababkii hore ee Internet Explorer. Si aad u hubiso inaad isticmaalayso qaabkii ugu dambeeyay ee IE, tixgeli inaad ku darto summada ku habboon <meta>
bogaggaaga:
Xaqiiji qaabka dukumeentiga adigoo furaya qalabka wax-ka-hortagga: taabo F12oo hubi "Qaabka Dukumentiga".
Summadan waxay ku jirtaa dhammaan dukumeentiyada Bootstrap iyo tusaalooyinka si loo hubiyo sida ugu wanaagsan ee suurtogalka ah ee nooc kasta oo Internet Explorer ah oo la taageero.
Ka eeg su'aasha StackOverflow wixii macluumaad dheeraad ah.
Internet Explorer 10 kama soocna ballaca aaladda ballaca daawashada , sidaas awgeedna si habboon uma dabaqdo weydiimaha warbaahinta ee Bootstrap's CSS . Caadi ahaan waxaad ku dari lahayd qayb yar oo degdeg ah oo CSS ah si tan loo hagaajiyo:
Si kastaba ha ahaatee, tani uma shaqaynayso aaladaha ku shaqeeya Windows Phone 8 versions ka weyn Update 3 (loo yaqaan GDR3) , sababtoo ah waxay keenaysaa qalabkan oo kale inay muujiyaan muuqaal u badan desktop halkii ay cidhiidhi lahaayeen aragtida "telefoonka". Si aad tan wax uga qabato, waxaad u baahan doontaa inaad ku darto CSS-ga soo socda iyo JavaScript si aad uga shaqeyso bug .
Macluumaad dheeraad ah iyo tilmaamaha isticmaalka, akhri Windows Phone 8 iyo Aaladda-ballaadhka .
Horudhac ahaan, waxaan tan ku darnaa dhammaan dukumeentiyada Bootstrap iyo tusaalooyin muujin ahaan.
Matoorka samaynta ee noocyada Safari ka hor v7.1 ee OS X iyo Safari ee macruufka v8.0 ayaa xoogaa dhib ah kala kulmay tirada meelaha tobanlaha ah ee loo isticmaalo .col-*-1
fasaladayada grid. Markaa haddii aad lahayd 12 tiir oo sharooto ah, waxaad ogaan lahayd inay gaabnaayeen marka la barbar dhigo safafka kale ee tiirarka. Ka sokow cusboonaysiinta Safari/iOS, waxaad haysataa qaar ka mid ah fursadaha xalinta shaqada:
.pull-right
tiirarkaagii ugu dambeeyay si aad u hesho toosinta midig ee adagTaageerada curiyaha overflow: hidden
ayaa <body>
aad u xaddidan macruufka iyo Android. Si taas loo gaaro, marka aad ka gudubto xagga sare ama hoose ee modal mid ka mid ah daalacashada aaladahaas, <body>
waxa ku jira ayaa bilaabi doona in ay rogaan. Eeg bug Chrome ah #175502 (ku xidhan Chrome v40) iyo bug WebKit #153852 .
Sida iOS 9.3, halka modal furan yahay, haddii taabashada bilowga ah ee tilmaanta duubku ay ku dhex jirto xadka qoraalka <input>
ama a <textarea>
, <body>
waxa ku jira modalka hoostiisa waa la rogrogmi doonaa halkii modal laftiisa. Fiiri WebKit bug #153856 .
Sidoo kale, la soco in haddii aad isticmaalayso navbar go'an ama aad isticmaalayso agabka gudaha modal, iOS waxa uu leeyahay bug samaynta oo aan cusboonaysiin booska walxaha go'an marka kiiboodhka farsamada la kiciyo. Waxyaabo dhowr ah oo tan ah waxaa ka mid ah inaad u beddesho walxahaaga position: absolute
ama u yeerida saacada diirada saara si aad isugu daydo inaad gacanta ku saxdo meelaynta. Tan ma maamusho Bootstrap, markaa adiga ayay kugu xiran tahay inaad go'aansato xalka ugu fiican codsigaaga.
Cunsurka .dropdown-backdrop
looma isticmaalo IOS ee nav sababtoo ah kakanaanta z-indexing. Markaa, si aad u xidho hoos u dhaca navbars, waa inaad si toos ah u gujisaa qaybta hoos u dhaca (ama shay kasta oo kale kaas oo kicin doona dhacdo gujin ah oo ku taal iOS ).
Soo-dhoweynta bogga ayaa si lama filaan ah u soo bandhigaysa samaynta farshaxan ee qaybaha qaarkood, labadaba Bootstrap iyo inta kale ee shabakadda. Iyadoo ay ku xiran tahay arrinta, waxaa laga yaabaa inaan awoodno inaan hagaajino (marka hore raadi ka dibna fur arrin haddii loo baahdo). Si kastaba ha ahaatee, waxaan u muuqannaa inaan iska indhatirno kuwan maadaama aysan inta badan haysan xal toos ah oo aan ahayn xalal xun.
:hover
/ :focus
mobilkaIn kasta oo dullimaad dhab ahi aanay suurtogal ahayn inta badan shaashadaha taabashada, badi daalacashada moobiilku waxa ay ku daydaan taageerada kor u kaca oo ay sameeyaan :hover
"ku dheggan". Si kale haddii loo dhigo, :hover
qaababka ayaa bilaabaya codsashada ka dib marka la taabto shay oo kaliya jooji codsiga ka dib marka isticmaaluhu taabto shay kale. Tani waxay sababi kartaa in :hover
gobolada Bootstrap ay si aan la rabin u "ku dheggan" daalacashada noocaas ah. Qaar ka mid ah daalacashada mobilada ayaa sidoo kale sameeya :focus
si la mid ah kuwa dhegdheg leh. Hadda ma jirto xal fudud oo arrimahan ah oo aan ka ahayn in gebi ahaanba meesha laga saaro qaababkaas.
Xataa daalacashada casriga ah qaarkood, daabacaaddu waxay noqon kartaa mid qariib ah.
Gaar ahaan, sida Chrome v32 iyo iyada oo aan loo eegin goobaha margin, Chrome waxay isticmaashaa ballaca aragtida si aad uga yar cabbirka warqadda jireed marka la xalinayo weydiimaha warbaahinta marka la daabacayo bogga shabakadda. Tani waxay keeni kartaa in Bootstrap-ka-yar-yar ee dheeraadka ah si lama filaan ah loo hawlgeliyo marka la daabacayo. Faahfaahinta qaar ka eeg arrinta #12078 iyo Chrome bug # 273306 Hagaajinta la soo jeediyay:
@screen-*
doorsoomayaasha Yaryar si warqadaada daabacaada loo tixgeliyo inay ka weyn tahay kuwa yar yar.Sidoo kale, sida Safari v8.0, ballac go'an.container
s waxay sababi kartaa Safari inay isticmaasho cabbir yar oo aan caadi ahayn marka la daabacayo. Fiiri #14868 iyo WebKit bug #138192 wixii faahfaahin dheeraad ah. Mid ka mid ah xalinta suurtagalka ah ee tan ayaa ku daraya CSS soo socda:
Marka laga reebo sanduuqa, Android 4.1 (iyo xitaa qaar cusub oo la sii daayay sida muuqata) waxay la soo degtaa abka Browser-ka oo ah browser-ka caadiga ah ee dookha (oo ka duwan Chrome). Nasiib darro, abka Browserku wuxuu leeyahay kutaanno badan iyo iswaafaqla'aan la xiriira CSS guud ahaan.
Cunsurrada <select>
, browserka saamiyada Android ma soo bandhigi doono kontaroolada dhinac haddii ay jiraan border-radius
iyo/ama border
lagu dabaqay. (Fiiri su'aashan StackOverflow<select>
ka StackOverflow Wakiilka adeegsadaha dhuuqida ayaa ka fogaanaya faragelinta Chrome, Safari, iyo daalacashada Mozilla.
Ma rabtaa inaad aragto tusaale? Fiiri JS Bin demo.
Si loo siiyo khibrada ugu wanaagsan ee suurtogalka ah daalacashada duugga ah iyo kuwa buggy, Bootstrap ayaa isticmaala hacks browser CSS meelo badan si ay u beegsato CSS gaar ah noocyada browserka qaarkood si ay uga shaqeeyaan kutaannada daalacashada laftooda. Dhacdooyinkan si la fahmi karo waxay sababaan ansaxayaasha CSS inay ka cawdaan inay khaldan yihiin. Meelo lamaane ah, waxaan sidoo kale isticmaalnaa astaamaha CSS-da ee dhiig-baxa kuwaas oo aan wali si buuxda loo habayn, laakiin kuwan waxa kaliya loo isticmaalaa kobcinta horumarka.
Digniintan ansaxinta ah shaqo kuma laha ficil ahaan maadaama qaybta aan jabsanayn ee CSS-tayadu si buuxda u ansixiso oo qaybaha jabsiga ahi aanay faragelin habsami u shaqaynta qaybta aan jabsanayn, sidaa awgeed sababta aanu si ula kac ah isaga indho-tirno digniinahaas gaarka ah.
Dukumeentiyadayada HTML sidoo kale waxay leeyihiin digniino ansax ah oo HTML ah oo aan waxtar lahayn oo aan macno lahayn taas oo ay ugu wacan tahay ku darista hab-dhaqanka cilad Firefox gaar ah .
In kasta oo aynaan si rasmi ah u taageerin wax plugins ah oo dhinac saddexaad ah ama lagu daro, waxaanu ku siinaynaa talo waxtar leh si looga fogaado arrimaha suurtagalka ah ee mashaariicdaada.
Qaar ka mid ah software-ka saddexaad, oo ay ku jiraan Khariidadaha Google iyo Mashiinka Raadinta Gaarka ah ee Google, ayaa iska hor imanaya Bootstrap sababtoo ah * { box-sizing: border-box; }
, qaanuunka ka dhigaya sidaas padding
ma saameynayo ballaca ugu dambeeya ee shay. Baro wax badan oo ku saabsan moodelka sanduuqa iyo cabbirida CSS Tricks .
Iyadoo ku xiran macnaha guud, waxaad ka gudbi kartaa hadba sida loogu baahdo (Doorashada 1) ama waxaad dib u dejin kartaa cabbirka sanduuqa dhammaan gobollada (Doorashada 2).
Bootstrap waxay raacdaa heerarka shabakadaha caadiga ah iyo-iyada oo leh dadaal dheeri ah oo yar-waxaa loo isticmaali karaa in lagu abuuro goobo ay heli karaan kuwa isticmaalaya AT .
Haddii navigation-kaagu ka kooban yahay xiriiriyeyaal badan oo uu ka horeeyo nuxurka ugu muhiimsan ee DOM, ku dar Skip to main content
xiriiriye ka hor navigation (sharaxaad fudud, fiiri maqaalkan Mashruuca A11Y ee ku saabsan isku xirka navigation boodboodka ). Isticmaalka .sr-only
fasalka waxay si muuqaal ah u qarin doontaa isku xirka boodboodka, .sr-only-focusable
fasalkuna wuxuu hubin doonaa in iskuxirku uu noqdo mid muuqda marka la eego (isticmalayaasha kiiboodhka aragga ah).
Sababo la xiriira cilladaha muddada dheer ee Chrome-ka (eeg qodobka 262171 ee Chromium bug tracker ) iyo Internet Explorer (ka eeg maqaalkan ku saabsan xiriirinta bogga iyo habaynta diiradda ), waxaad u baahan doontaa inaad hubiso in bartilmaameedka xiriirintaada boodada waa ugu yaraan barnaamij ahaan diirada lagu saari karo iyadoo lagu darayotabindex="-1"
.
Intaa waxaa dheer, waxaa laga yaabaa inaad rabto inaad si cad u cabudhiso tilmaanta diirada muuqata ee bartilmaameedka (gaar ahaan sida Chrome uu hadda u dejiyo diiradda walxaha leh tabindex="-1"
marka lagu riixo jiirka) oo leh #content:focus { outline: none; }
.
Ogsoonow in cayayaankani uu sidoo kale saameyn doono xiriiriyeyaasha kale ee boggaga laga yaabo in goobtaadu isticmaasho, taasoo ka dhigaysa mid aan waxtar u lahayn isticmaalayaasha kiiboodhka. Waxaa laga yaabaa inaad tixgeliso inaad ku darto hagaajin la mid ah joogsiga joogsiga dhammaan kuwa kale ee la magacaabay barroosinnada / tilmaamayaasha jajabka ee u shaqeeya sidii bartilmaameedyada isku xirka.
Marka ciwaanada buulka ( <h1>
- <h6>
), madaxa dukumeentigaaga koowaad waa inuu ahaado <h1>
. Ciwaannada xiga waa inay si macquul ah u adeegsadaan <h2>
-<h6>
sida in akhristayaasha shaashadu ay u dhisi karaan tusmada boggagaaga.
Wax badan ka baro HTML CodeSniffer iyo Helitaanka Awoodda Gobolka Penn .
Waqtigan xaadirka ah, qaar ka mid ah isku dhafka midabka caadiga ah ee laga heli karo Bootstrap (sida fasallada badhanka qaabaysan ee kala duwan , qaar ka mid ah koodhka muujinaya midabada loo isticmaalo blocks code aasaasiga ah , fasalka caawiyaha .bg-primary
asalka ah, iyo midabka isku xidhka caadiga ah marka loo isticmaalo asal cad) leeyihiin saamiga isbarbardhigga hooseeya (ka hooseeya saamiga lagu taliyey ee 4.5: 1 ). Tani waxay dhibaato u keeni kartaa isticmaalayaasha aragga hooseeya ama kuwa midabka indhoolaha ah. Midabadaan caadiga ah ayaa laga yaabaa inay u baahdaan in wax laga beddelo si loo kordhiyo isbar-bardhigga iyo sharci ahaanshahooda.
Bootstrap waxaa lagu sii daayay shatiga MIT oo waa xuquuqda daabacaada 2016 Twitter. La kariyey ilaa qaybo yaryar, waxaa lagu tilmaami karaa xaaladaha soo socda.
Shatiga Bootstrap oo buuxa wuxuu ku yaalaa kaydka mashruuca wixii macluumaad dheeraad ah.
Xubnaha bulshadu waxay u turjumeen waraaqaha Bootstrap luqado kala duwan. Midna si rasmi ah looma taageero waxaana laga yaabaa inaysan mar walba la socon.
Ma caawino abaabulka iyo martigelinta turjumaada, kaliya waxaan ku xidhnaa iyaga.
Ma dhammaysay turjumaad cusub ama ka wanaagsan? Fur codsi jiid si aad ugu darto liiskayaga.