सुरवात करप
Bootstrap ची एक नियाळ, डाउनलोड कशें करप आनी वापरप, मुळावे साचे आनी उदाहरणां, आनी हेर.
Bootstrap ची एक नियाळ, डाउनलोड कशें करप आनी वापरप, मुळावे साचे आनी उदाहरणां, आनी हेर.
बूटस्ट्रॅप (सद्या v3.3.7) कडेन बेगीन सुरू करपाचे कांय सोपे मार्ग आसात, दरेक वेगळ्या कुशळटाय पातळेक आनी वापर प्रकरणाक आकर्शीत करता. तुमच्या खाशेल्या गरजे प्रमाण कितें तें पळोवपा खातीर वाचात.
CSS, जावास्क्रिप्ट, आनी फॉन्ट संकलित आनी ल्हान केल्ले. खंयचेच डॉक्स वा मूळ स्त्रोत फायली समाविष्ट करूंक नात.
Source Less, JavaScript, आनी फॉन्ट फायली, आमच्या डॉक्सां वांगडा. Less compiler आनी कांय सेटअप जाय.
Rails, Compass, वा Sass-only प्रकल्पांत सोंपेंपणान आस्पाव करपाखातीर बूटस्ट्रॅप Less कडल्यान Sass कडेन पोर्ट केला .
jsDelivr हांगा आशिल्ले लोक कृपा करून Bootstrap च्या CSS आनी JavaScript खातीर CDN आदार दितात. फकत हे Bootstrap CDN दुवे वापरात.
तुमी Bower वापरून Bootstrap ची Less, CSS, JavaScript, आनी फॉन्ट स्थापीत करूंक आनी वेवस्थापन करूंक शकतात :
तुमी npm वापरून Bootstrap स्थापीत करूंक शकतात :
require('bootstrap')
Bootstrap च्या सगळ्या jQuery प्लगइनांक jQuery वस्तूचेर लोड करतले. मॉड्यूल bootstrap
स्वता कांयच निर्यात करिना. /js/*.js
पॅकेजीच्या वयल्या पांवड्यावेल्या निर्देशिका खाला फायली लोड करून तुमी Bootstrap च्या jQuery प्लगइनांक वैयक्तीकपणान हाताळणीन लोड करूंक शकतात .
Bootstrap's package.json
हातूंत सकयल दिल्ल्या कळाखाला कांय अतिरिक्त मेटाडेटा आसा:
less
- बूटस्ट्रॅपाच्या मुखेल कमी स्त्रोत फायलीक मार्गstyle
- मुलभूत मांडावळी वापरून पूर्वसंकलित केल्ल्या बूटस्ट्रॅपाच्या बिगर-मिनफायड CSS चो मार्ग (पसंतीची कसलीच ना)तुमी Composer वापरून Bootstrap ची Less, CSS, JavaScript, आनी फॉन्ट स्थापीत करूंक आनी वेवस्थापन करूंक शकतात :
बूटस्ट्रॅप CSS विक्रेत्याच्या उपसर्गांकडेन वेव्हार करपाखातीर Autoprefixer वापरता . तुमी Bootstrap ताच्या Less/Sass स्त्रोता वयल्यान संकलित करतात आनी आमची Gruntfile वापरनात जाल्यार, तुमकां स्वता तुमच्या बिल्ड प्रक्रियेंत Autoprefixer एकठांय करचो पडटलो. तुमी पूर्वसंकलित बूटस्ट्रॅप वापरतात वा आमची Gruntfile वापरतात जाल्यार, तुमकां हाचो हुस्को करपाची गरज ना कारण Autoprefixer आमच्या Gruntfile मदीं पयलींच एकत्रीत केला.
बूटस्ट्रॅप दोन रुपांनी डाउनलोड करपाक मेळटा, जाचे भितर तुमकां सकयल दिल्ल्यो निर्देशिका आनी फायली मेळटलीं, तार्कीक रितीन सामान्य संसाधनांचो गट करप आनी संकलित आनी ल्हान केल्ले दोनूय बदल पुरवण करप.
उपकार करून लक्षांत दवरात की सगळ्या जावास्क्रिप्ट प्लगइनांक jQuery समाविष्ट करपाची गरज आसा, जशें स्टार्टर साच्यांत दाखयलां . jQuery च्या खंयच्या आवृत्त्यांक तेंको आसा तें पळोवपाक आमचो सल्लो घेयात .bower.json
एकदां डाउनलोड केल्या उपरांत, (संकलित केल्ली) बूटस्ट्रॅपाची रचणूक पळोवपाक संकुचीत फोल्डर अनझिप करात. तुमकां अशें कितें तरी दिसतलें:
हो Bootstrap चो सगळ्यांत मुळावो प्रकार: लागीं लागीं खंयच्याय वेब प्रकल्पांत बेगीन ड्रॉप-इन वापरा खातीर पूर्वसंकलित फायली. आमी संकलित CSS आनी JS ( bootstrap.*
), तशेंच संकलित आनी लघुकृत CSS आनी JS ( bootstrap.min.*
) पुरवण करतात. CSS स्त्रोत नकाशे ( bootstrap.*.map
) कांय ब्राउझरांच्या विकसक साधनां वांगडा वापरपाखातीर उपलब्ध आसात. Glyphicons च्या फॉन्टांचो आस्पाव केला, तशेंच पर्यायी Bootstrap थीम आसा.
Bootstrap स्त्रोत कोड डाउनलोडांत पूर्वसंकलित CSS, JavaScript, आनी फॉन्ट मालमत्ता, स्त्रोत Less, JavaScript, आनी दस्तावेजीकरणा वांगडा आसपावीत केल्या. चड विशिश्टपणान, तातूंत सकयल दिल्ल्या आनी हेर गजालींचो आस्पाव आसा:
less/
, js/
, आनी हे fonts/
आमच्या CSS, JS, आनी चिन्न फॉन्टांखातीर (अनुक्रमान) स्त्रोत कोड आसात. dist/
वयर पूर्वसंकलित डाउनलोड विभागांत दिल्लें सगळें फोल्डरांत आसपावीत केलां . फोल्डरांत आमच्या दस्तावेजीकरणाखातीर, आनी बूटस्ट्रॅप वापराचो docs/
स्त्रोत कोड आसपावीत केला . examples/
ताचे भायर, हेर खंयचीय समाविष्ट केल्ली फायल पॅकेजीं, परवानो म्हायती, आनी विकासा खातीर आदार पुरवण करता.
बूटस्ट्रॅप आपल्या बिल्ड प्रणालीखातीर Grunt वापरता, फ्रेमवर्कासयत काम करपाखातीर सोयीस्कर पद्दतींवांगडा. आमी आमचो कोड कसो संकलित करतात, चांचण्यो चलयतात, आनी हेर कशे तरेन करतात तें.
Grunt प्रतिष्ठापीत करपाक, तुमी पयलीं node.js (हातूंत npm आसपावीत आसा) डाउनलोड करून प्रतिष्ठापीत करचो पडटलो. npm हो नोड पॅकेज केल्ल्या मॉड्यूलांचो उल्लेख करता आनी node.js वरवीं विकास अवलंबन वेवस्थापन करपाचो एक मार्ग आसा.
मागीर, आदेश ओळींतल्यान:grunt-cli
कडेन जागतीकपणान प्रतिष्ठापीत करात npm install -g grunt-cli
./bootstrap/
निर्देशिकेंत वचचें, मागीर चालीक लावचें npm install
. npm फायल पळयतले package.json
आनी थंय वळेरी केल्लीं गरजेचीं थळावीं अवलंबनां आपसूक प्रतिष्ठापीत करतले.पुराय जातकच, तुमकां आदेश ओळींतल्यान दिल्ले वेगवेगळे Grunt आदेश चालीक लावंक मेळटले.
grunt dist
(फक्त CSS आनी JavaScript संकलित करात)संकलित /dist/
आनी ल्हान केल्ल्या CSS आनी JavaScript फायलींनी निर्देशिका परतून तयार करता. बूटस्ट्रॅप वापरपी म्हूण, ही सामान्यपणान तुमकां जाय आशिल्ली आदेश आसा.
grunt watch
(पळोवप)Less स्त्रोत फायली पळयता आनी जेन्ना तुमी बदल जतनाय घेतात तेन्ना आपसूक तीं CSS कडेन परतून संकलित करता.
grunt test
(चांचण्यो चलोवप) .JSHint चालीक लायता आनी PhantomJS त QUnit चांचण्यो हेडलेस चालीक लायता .
grunt docs
(docs मालमत्ता तयार करप & चांचणी करप)CSS, JavaScript, आनी हेर मालमत्ता तयार करता आनी चांचणी करता जी वरवीं दस्तावेजीकरण थळाव्यान चालीक लायतना वापरतात bundle exec jekyll serve
.
grunt
(एकदम सगळें बांदून चांचण्यो चलोवच्यो)CSS आनी JavaScript संकलित करता आनी ल्हान करता, दस्तावेजीकरण संकेतथळ तयार करता, डॉक्स आड HTML5 प्रमाणक चालीक लायता, Customizer मालमत्ता परतून तयार करता, आनी हेर. जेकिलाची गरज आसा . चड करून फकत तुमी बूटस्ट्रॅपाचेरच हॅकिंग करतात जाल्यार गरजेचें.
तुमकां अवलंबन प्रतिष्ठापीत करपाक वा Grunt आदेश चालीक लावपाक समस्या येवंक जाय जाल्यार, पयलीं /node_modules/
npm कडल्यान तयार केल्ली निर्देशिका काडून उडोवची. मागीर, परतून चालीक लावचें npm install
.
ह्या मुळाव्या HTML साच्यान सुरू करात, वा हीं उदाहरणां बदलात . तुमी आमचे साचे आनी उदाहरणां सानुकूल करतले, तुमच्या गरजे प्रमाणें अनुकूल करतले अशी आस्त बाळगता.
उण्यांत उण्या Bootstrap दस्तावेजा वांगडा काम करपाक सुरवात करपाक सकयल दिल्लो HTML कॉपी करात.
Bootstrap च्या जायत्या घटकां सयत वयर दिल्ल्या मुळाव्या साच्याचेर तयार करात. तुमच्या वैयक्तीक प्रकल्पाच्या गरजे प्रमाणें Bootstrap सानुकूल करपाक आनी अनुकूल करपाक आमी तुमकां प्रोत्साहन दितात.
बूटस्ट्रॅप रिपॉझिटरी डाउनलोड करून सकयल दिल्ल्या दर एका उदाहरणाखातीर स्त्रोत कोड मेळोवचो . उदाहरणां docs/examples/
निर्देशिकेंत मेळटात.
न्याय्य दुवे आशिल्ली सानुकूल नवबार तयार करात. तकली वयर काडटा! चड सफारी इश्टागत करपी न्हय.
बूटलिंट हें अधिकृत बूटस्ट्रॅप एचटीएमएल लिंटर साधन आसा. तो आपोआप Bootstrap वापरपी वॅबपानांनी जायत्यो सामान्य HTML चुको तपासता जे फामाद "व्हॅनिला" पद्दतीन करतात. Vanilla Bootstrap च्या घटकांक/विजेटांक DOM च्या तांच्या भागांक कांय संरचनां प्रमाणें आसपाक जाय. बूटस्ट्रॅप घटकांच्या प्रसंगांनी योग्य रितीन-रचणूक केल्ली HTML आसा काय ना तें बूटलिंट तपासता. तुमच्या Bootstrap वेब विकास साधनसाखळींत Bootlint जोडपाचो विचार करात जेणे करून खंयचीच सामान्य चूक तुमच्या प्रकल्पाची विकास मंद करची न्हय.
बूटस्ट्रॅपाच्या विकासा विशीं अद्ययावत रावचें आनी ह्या उपकारक साधनां वरवीं समाजा मेरेन पावचें.
irc.freenode.net
सर्वरांत, ##bootstrap चॅनलांत , IRC वापरून सहकारी बूटस्ट्रॅपरां कडेन गप्पा मारात .twitter-bootstrap-3
चेर विचारात .bootstrap
वा तत्सम वितरण यंत्रणे वरवीं वितरीत करतना Bootstrap कार्यक्षमताय बदलपी वा जोडपी पॅकेजींचेर विकसकांनी कीवर्ड वापरपाक जाय .तशेंच ताज्या गॉसिप आनी अद्भुत संगीत व्हिडियो खातीर तुमी ट्विटराचेर @getbootstrap हांकां फॉलो करूंक शकतात .
बूटस्ट्रॅप आपसूक तुमचीं पानां वेगवेगळ्या स्क्रीन आकारां खातीर अनुकूल करता. हांगां हें वैशिश्ट्य कशें अक्षम करचें म्हणजे तुमचें पान ह्या प्रतिसाद नाशिल्ल्या उदाहरणा प्रमाणें काम करता .
<meta>
उल्लेख केल्लो व्यूपोर्ट वगडावचोwidth
एकूच रुंदाय आशिल्ल्या दरेक ग्रिड टियर खातीर on the ओव्हररायड करात .container
, देखीक width: 970px !important;
हें मुलभूत Bootstrap CSS उपरांत येता हाची खात्री करात. तुमी पर्यायीपणान !important
माध्यम क्वेरी वा कांय निवडक-फू कडेन टाळूंक शकतात..col-xs-*
मध्यम/व्हडल्यां भायर, वा ताचे सुवातेर वर्ग वापरात. काळजी करूंक नाकात, अतिरिक्त-ल्हान डिव्हायस ग्रिड सगळ्या रिझोल्यूशनांक स्केल करता.तुमकां अजूनय IE8 खातीर Respond.js जाय पडटलो (आमचीं मिडिया क्वेरी अजूनय आसात आनी ताचेर प्रक्रिया करपाची गरज आशिल्ल्यान). हाका लागून बूटस्ट्रॅपाचे "मोबायल साइट" आंग अक्षम जातात.
आमी हीं पावलां एका उदाहरणाक लागू केल्यांत. विशिश्ट बदल चालीक लायिल्ले पळोवपाक ताचो स्त्रोत कोड वाचात.
Bootstrap च्या पोरन्या आवृत्तींतल्यान v3.x कडेन स्थलांतर करपाक सोदता? पळयात आमचो स्थलांतर मार्गदर्शक .
बूटस्ट्रॅप नवीनतम डेस्कटॉप आनी मोबायल ब्राउझरांत सगळ्यांत बरे तरेन काम करपाक तयार केला, म्हळ्यार पोरने ब्राउझर कांय घटकांचे वेगवेगळे शैलीचे, जरी पुरायपणान कार्यक्षम आसले तरी, रेंडरींग दाखोवंक शकतात.
खासा करून, आमी सकयल दिल्ल्या ब्राउझर आनी प्लॅटफॉर्मांच्या नवीनतम आवृत्त्यांक तेंको दितात .
WebKit, Blink, वा Gecko ची नवीनतम आवृत्ती वापरपी पर्यायी ब्राउझर, थेट वा प्लॅटफॉर्माच्या वेब पळोवप API वरवीं, स्पश्टपणान समर्थीत नात. पूण, Bootstrap (चडशा प्रकरणांनी) ह्या ब्राउझरांनीय योग्य रितीन दाखोवंक आनी काम करपाक जाय. चड विशिश्ट आदार म्हायती सकयल दिल्या.
सादारणपणान, Bootstrap दरेका मुखेल प्लॅटफॉर्माच्या मुलभूत ब्राउझरांच्या नवीनतम आवृत्त्यांक तेंको दिता. लक्षांत दवरात की प्रॉक्सी ब्राउझर (देखीक Opera Mini, Opera Mobile चो Turbo मोड, UC Browser Mini, Amazon Silk) समर्थीत नात.
क्रोम हें नांव | फायरफॉक्स हांणी केला | सफारी हें नांव | |
---|---|---|---|
एंड्रॉयड हें नांव | समर्थीत केला | समर्थीत केला | एन / ए |
आयओएस | समर्थीत केला | समर्थीत केला | समर्थीत केला |
तेच प्रमाणें, चडशा डेस्कटॉप ब्राउझरांची नवीनतम आवृत्ती समर्थीत आसा.
क्रोम हें नांव | फायरफॉक्स हांणी केला | इंटरनॅट एक्सप्लोरर | ओपेरा | सफारी हें नांव | |
---|---|---|---|---|---|
मॅक हें नांव | समर्थीत केला | समर्थीत केला | एन / ए | समर्थीत केला | समर्थीत केला |
जनेलां | समर्थीत केला | समर्थीत केला | समर्थीत केला | समर्थीत केला | समर्थीत ना |
Windows चेर, आमी Internet Explorer 8-11 चो समर्थन करतात .
Firefox खातीर, नवीनतम सामान्य स्थिर प्रकाशना वांगडाच, आमी Firefox च्या नवीनतम विस्तारीत आदार प्रकाशन (ESR) आवृत्तीकय तेंको दितात.
अनधिकृतपणान, बूटस्ट्रॅप क्रोमियम आनी क्रोम फॉर लिनक्स, फायरफॉक्स फॉर लिनक्स, आनी इंटरनॅट एक्सप्लोरर 7, तशेंच मायक्रोसॉफ्ट एजांत फावो त्या प्रमाणांत बरो दिसपाक जाय आनी वागपाक जाय, जरी तांकां अधिकृतपणान तेंको नासलो तरी.
बूटस्ट्रॅपाक झगडपाक जाय आशिल्ल्या कांय ब्राउझर बगांची वळेरी खातीर, पळयात आमची ब्राउझर बगांची वण्टी .
Internet Explorer 8 आनी 9 हांकांय तेंको आसा, पूण, उपकार करून लक्षांत दवरात की कांय CSS3 गुणधर्म आनी HTML5 घटक ह्या ब्राउझरां कडल्यान पुरायपणान समर्थीत नात. ते भायर, Internet Explorer 8 कडेन माध्यम क्वेरी आदार सक्षम करपाक Respond.js वापरपाची गरज आसा.
खाशेलपण | इंटरनॅट एक्सप्लोरर 8 | इंटरनॅट एक्सप्लोरर 9 |
---|---|---|
border-radius |
समर्थीत ना | समर्थीत केला |
box-shadow |
समर्थीत ना | समर्थीत केला |
transform |
समर्थीत ना | समर्थीत, -ms उपसर्गासयत |
transition |
समर्थीत ना | |
placeholder |
समर्थीत ना |
CSS3 आनी HTML5 वैशिश्ट्यांच्या ब्राउझर आदाराचेर तपशीलां खातीर हांव वापरूंक शकता... भेट दिवची .
Internet Explorer 8 खातीर तुमच्या विकास आनी उत्पादन वातावरणांत Respond.js वापरतना सकयल दिल्ल्या सावधानतायेची जतनाय घेयात.
वेगळ्या (उप)डोमेनाचेर (देखीक, CDN चेर) होस्ट केल्ल्या CSS वांगडा Respond.js वापरपाक कांय अतिरिक्त सेटअप जाय पडटा. तपशीलां खातीर Respond.js डॉक्स पळयात.
file://
ब्राउझर सुरक्षा नेमांक लागून, Respond.js प्रोटोकॉल वरवीं पळयल्ल्या पानांचेर काम करीना file://
(जशें थळावी HTML फायल उगडटना). IE8 त प्रतिसाद दिवपी वैशिश्ट्यांची चांचणी करपाक, HTTP(S) वरवीं तुमचीं पानां पळयात. तपशीलां खातीर Respond.js डॉक्स पळयात.
@import
Respond.js वरवीं संदर्भ दिल्ल्या CSS कडेन काम करीना @import
. खासा करून, कांय Drupal संरचना वापरपाक वळखतात @import
. तपशीलां खातीर Respond.js डॉक्स पळयात.
IE8 , , , वा box-sizing: border-box;
कडेन जोडल्यार पुरायपणान तेंको दिना . त्या कारणा खातीर, v3.0.1 सावन, आमी आतां s चेर वापरनात.min-width
max-width
min-height
max-height
max-width
.container
IE8 कडेन कांय प्रस्न आसात @font-face
जेन्ना जोडटात तेन्ना :before
. बूटस्ट्रॅप त्या संयोजनाचो वापर आपल्या ग्लिफिकॉन्स वांगडा करता. जर पान कॅश केला, आनी विंडोचेर माऊस नासतना लोड केला (म्हळ्यार रिफ्रेश बटण दामचें वा iframe त कितेंय लोड करचें) जाल्यार फॉन्ट लोड जावचे पयलीं पान रेंडर जाता. पानाचेर (बॉडी) होवर केल्यार कांय चिन्नां दाखयतले आनी उरिल्ल्या चिन्नांचेर होवर केल्यार तींय दाखयतले. तपशीलां खातीर अंक #13863 पळयात.
पोरन्या Internet Explorer सुसंगती मोडांत बूटस्ट्रॅप समर्थीत ना. तुमी IE खातीर नवीनतम रेंडरींग मोड वापरतात हाची खात्री करपाक, <meta>
तुमच्या पानांनी योग्य टॅग समाविष्ट करपाचो विचार करात:
डिबगिंग साधनां उगडून दस्तावेज मोडाची खात्री करात: दामचो F12आनी "दस्तावेज मोड" तपासात.
Internet Explorer च्या दरेक समर्थीत आवृत्तींत शक्य तितले बरे रेंडरींग सुनिश्चीत करपाक हो टॅग Bootstrap च्या सगळ्या दस्तावेजीकरणांत आनी उदाहरणांनी समाविष्ट केला.
चड म्हायती खातीर हो StackOverflow प्रस्न पळयात .
Internet Explorer 10 डिव्हायस रुंदायेक viewport रुंदाये पासून वेगळी करीना , आनी अशे तरेन Bootstrap च्या CSS त माध्यम क्वेरी योग्य रितीन लागू करिना. सादारणपणान तुमी फकत हें सुदारपाक CSS चो बेगीन स्निपेट जोडटले:
पूण, Update 3 (उर्फ GDR3) परस पोरणी Windows Phone 8 आवृत्त्यो चलोवपी डिव्हायसां खातीर हें काम करीना , कारण ताका लागून अशा डिव्हायसांक संकुचीत "फोन" दृश्या बदला चड करून डेस्कटॉप दृश्य दाखोवपाक कारण जाता. हाचेर उपाय काडपाक, बगाचेर काम करपाक तुमकां सकयल दिल्लें CSS आनी JavaScript समाविष्ट करचें पडटलें .
चड म्हायती खातीर आनी वापर मार्गदर्शक तत्वां खातीर, Windows Phone 8 आनी Device-Width वाचात .
एक heads up म्हूण, आमी हें Bootstrap च्या सगळ्या दस्तावेजीकरणांत आनी उदाहरणांनी एक प्रदर्शन म्हणून समाविष्ट करतात.
OS X खातीर v7.1 आनी iOS v8.0 खातीर Safari च्या आवृत्त्यांच्या रेंडरिंग इंजिनाक आमच्या .col-*-1
ग्रिड वर्गांत वापरिल्ल्या दशांश सुवातींच्या संख्येंत कांय त्रास जालो. देखून तुमचे कडेन 12 वैयक्तीक ग्रिड स्तंभ आसले जाल्यार, हेर स्तंभ वळींच्या तुळेंत ते ल्हान आयले हें तुमकां दिसतलें. Safari/iOS अपग्रेड करपा वांगडाच, तुमचे कडेन उपाय करपा खातीर कांय पर्याय आसात:
.pull-right
हार्ड-उजवें संरेखण मेळोवपाक तुमच्या निमाण्या ग्रिड स्तंभांत जोडातoverflow: hidden
on the element खातीर आदार <body>
iOS आनी Android त सामको मर्यादीत आसा. ते खातीर, जेन्ना तुमी त्या खंयच्याय डिव्हायसाच्या ब्राउझरांतल्या मोडलाच्या वयल्या वा सकयल्या भागांतल्यान स्क्रोल करतात, तेन्ना <body>
सामुग्री स्क्रोल करपाक लागतली. Chrome बग #175502 ( Chrome v40 त निवळ केला) आनी WebKit बग #153852 पळयात .
<input>
iOS 9.3 सावन, मोडल उक्तो आसतना, स्क्रोल हावभावाचो सुरवातीचो स्पर्श मजकूर वा a च्या मर्यादे भितर आसल्यार <textarea>
, <body>
मोडाला सकयल आशिल्ली सामग्री मोडलाच्याच बदला स्क्रोल जातली. वेबकिट बग #153856 पळयात .
तशेंच, लक्षांत दवरात की तुमी स्थिर नॅव्हबार वापरतात वा मोडाला भितर इनपुट वापरतात जाल्यार, iOS कडेन रेंडरींग बग आसा जो आभासी कीबोर्ड ट्रिगर करतना स्थिर घटकांची सुवात अद्ययावत करिना. हाचे खातीर कांय उपाय position: absolute
येवजण्यो हाताळणीन स्थिती दुरुस्त करपाचो यत्न करपाक तुमच्या घटकांचें रुपांतर करप वा फोकसाचेर टाइमर आवाहन करप हांचो आस्पाव जाता. हें Bootstrap कडल्यान हाताळना, देखून तुमच्या ऍप्लिकेशनाक खंयचो उपाय बरो आसा तें थारावप तुमचेर थारता.
z-indexing च्या गुंतागुंतीक लागून nav च्या iOS चेर .dropdown-backdrop
घटक वापरनात. अशे तरेन, navbars मदीं ड्रॉपडावन बंद करपाक, तुमी थेट ड्रॉपडावन घटकाचेर क्लिक करचो पडटलो (वा हेर खंयचोय घटक जो iOS त क्लिक घडणूक फायर करतलो ).
पृष्ठ झूम करप अपरिहार्यपणान कांय घटकांत रेंडरींग आर्टिफॅक्ट सादर करता, बूटस्ट्रॅप आनी उरिल्ल्या वेबांत. मुद्द्याचेर आदारून आमी तो सुदारूंक शकतले (पयलीं सोद घेयात आनी मागीर गरज पडल्यार मुद्दो उगडात). पूण, आमी ह्या कडेन दुर्लक्ष करपाची प्रवृत्ती आसता कारण तांकां चड करून हॅकी वर्कअराउंड सोडल्यार हेर कसलोच थेट उपाय नासता.
:hover
/ :focus
मोबायलाचेरचडशा टचस्क्रीनांचेर खरे होव्हरिंग शक्य नासलें तरी, चडशे मोबायल ब्राउझर होव्हरिंग समर्थनाचें अनुकरण करतात आनी :hover
"चिकट" करतात. म्हणल्यार, :hover
शैली एका घटकाक टॅप केल्या उपरांत लागू करपाक लागतात आनी वापरपी हेर खंयच्याय घटकाक टॅप केल्या उपरांतच लागू करपाक बंद करतात. हाका लागून Bootstrap ची :hover
स्थिती अशा ब्राउझरांचेर अनिष्ट "अडकून" जावंक शकता. कांय मोबायल ब्राउझरूय :focus
अशेच तरेन चिकट करतात. अशो शैली पुरायपणान काडून उडोवपा बगर सध्या ह्या प्रस्नां खातीर सादें उपाय ना.
कांय आधुनीक ब्राउझरांत लेगीत छापणावळ विचित्र आसूं येता.
खासा करून, Chrome v32 प्रमाणें आनी मार्जिन मांडावळींची पर्वा करिनासतना, Chrome वॅबपान छापतना माध्यम क्वेरी सोडोवपाक भौतिक कागद आकारा परस लक्षणीय रितीन अरुंद व्ह्यूपोर्ट रुंदायेचो वापर करता. हाचो परिणाम म्हळ्यार मुद्रण करतना Bootstrap ची अतिरिक्त-ल्हान ग्रिड अनपेक्षीतपणान सक्रिय जावंक शकता. कांय तपशीलां खातीर मुद्दो #12078 आनी Chrome बग #273306 पळयात. सुचयल्ले उपाय: १.
@screen-*
तुमचो मुद्रक कागद अतिरिक्त-ल्हान परस व्हड मानपाक मेळचो म्हूण कमी चयापचयाचीं मोलां पसंतीचीं करात .तशेंच, Safari v8.0 च्या प्रमाणें, स्थिर-रुंदायेच्या .container
s कडेन Safari मुद्रण करतना असामान्य ल्हान फॉन्ट आकार वापरपाक कारण जावंक शकता. चड तपशीलां खातीर # 14868 आनी WebKit बग #138192 पळयात. हाचेखातीर एक संभाव्य उपाय म्हळ्यार सकयल दिल्लो CSS जोडप:
बॉक्सांतल्यान भायर, Android 4.1 (आनी कांय नवी प्रकाशनां लेगीत दिसता) ब्राउझर ऍप्लिकेशना वांगडा निवडीचो मुलभूत वेब ब्राउझर म्हणून धाडटात (Chrome च्या विरुद्ध). दुर्दैवान, ब्राउझर ऍप्लिकेशनांत जायते बग आनी सामान्यपणान CSS कडेन विसंगती आसात.
घटकांचेर , जर एक आनी/वा लागू <select>
केला जाल्यार Android स्टॉक ब्राउझर बाजू नियंत्रण दाखोवचो ना . ( तपशीलां खातीर हो StackOverflow प्रस्न पळयात.) आक्षेपार्ह CSS काडून उडोवपाक आनी Android स्टॉक ब्राउझराचेर the unstyled घटक म्हणून रेंडर करपाक सकयल दिल्ल्या कोडाचे स्निपेट वापरात. वापरपी एजंट सुंगटां मारप Chrome, Safari, आनी Mozilla ब्राउझरांत हस्तक्षेप टाळटा.border-radius
border
<select>
एक उदाहरण पळोवपाक जाय? पळयात हो जेएस बिन डेमो.
पोरन्या आनी बगी ब्राउझरांक शक्य तितलो बरो अणभव दिवपा खातीर, बूटस्ट्रॅप ब्राउझरांतल्या स्वता बगांचेर काम करपा खातीर कांय ब्राउझर आवृत्त्यांक खाशेल्या CSS लक्ष्य करपाक जायत्या सुवातींनी CSS ब्राउझर हॅक वापरता. ह्या हॅकांक लागून CSS प्रमाणकांक ते अवैध आसात अशी कागाळ करप समजून घेवपासारकें आसा. एक दोन सुवातींनी, आमी ब्लीडिंग-एज CSS वैशिश्ट्यांय वापरतात जीं अजून पुरायपणान प्रमाणीत करूंक नात, पूण हीं शुध्दपणान प्रगतीशील वाडोवपा खातीर वापरतात.
आमच्या CSS चो बिगर-हॅकी भाग पुरायपणान प्रमाणीत करता आनी हॅकी भाग बिगर-हॅकी भागाच्या योग्य कार्यांत हस्तक्षेप करिनात देखून ह्या प्रमाणीकरण शिटकावणींक वेव्हारांत कसलोच फरक पडना, देखून आमी मुद्दाम ह्या खाशेल्या शिटकावणीं कडेन दुर्लक्ष कित्याक करतात.
आमच्या HTML डॉक्सांत तशेंच कांय तुच्छ आनी निरर्थक HTML प्रमाणीकरण शिटकावणी आसात कारण आमच्या एका खाशेल्या Firefox बगा खातीर एक वर्कअराउंड आस्पाव केला वर्कअराउंड आस्पाव केला .
आमी अधिकृतपणान खंयच्याय तिसऱ्या पक्षाच्या प्लगइन वा ऍड-ऑनाक तेंको दिना तरी, तुमच्या प्रकल्पांत संभाव्य समस्या टाळपाक मदत करपाक आमी कांय उपेगी सल्लो दितात.
कांय तिसऱ्या पक्षाच्या सॉफ्टवॅर, Google Maps आनी Google सानुकूल सोद इंजिन सयत, Bootstrap कडेन संघर्श करतात कारण * { box-sizing: border-box; }
, एक नेम जो अशें करता तो padding
घटकाच्या निमाण्या गणीत केल्ल्या रुंदायेचेर परिणाम करिना. CSS Tricks हांगा बॉक्स मॉडेल आनी आकारमान विशीं चड जाणून घेयात .
संदर्भाचेर आदारून, तुमी गरज पडल्यार अधिलिखित करूंक शकतात (पर्याय 1) वा पुराय प्रदेशांखातीर बॉक्स-आकार रिसेट करूंक शकतात (पर्याय 2).
बूटस्ट्रॅप सामान्य वेब मानकांचें पालन करता आनी-उण्यांत उणो अतिरिक्त यत्न करून-AT वापरपी लोकांक सुलभ अशीं सायटी तयार करपाक वापरूं येता .
तुमच्या नेव्हिगेशनांत जायत्यो दुवे आसल्यार आनी DOM त मुखेल सामुग्री पयलीं येता जाल्यार, Skip to main content
नेव्हिगेशनाच्या आदीं दुवो जोडात (साद्या स्पश्टीकरणा खातीर, नेव्हिगेशन दुवे वगडावपाचेर हो A11Y प्रकल्प लेख पळयात ). वर्ग वापरल्यार .sr-only
वगडावप दुवो दृश्टीन लिपयतलो, आनी .sr-only-focusable
वर्ग एकदां केंद्रीत जातकच दुवो दिसतलो हाची खात्री करतलो (दृष्टी आशिल्ल्या कीबोर्ड वापरप्यां खातीर).
Chrome त बऱ्याच काळासावन आशिल्ल्या उणावांक/बगांक लागून ( Cromium बग ट्रॅकरांत मुद्दो 262171 पळयात ) आनी Internet Explorer ( पानांतल्या दुव्यांचेर आनी फोकस क्रमाचेर हो लेख पळयात ), तुमकां तुमच्या वगडावपाच्या दुव्याचें लक्ष्य आसा हाची खात्री करची पडटली जोडून उण्यांत उणें प्रोग्रामेटिक फोकस करपाक मेळटा tabindex="-1"
.
ते भायर, तुमकां लक्ष्याचेर दिसपी फोकस संकेत स्पश्टपणान दामपाक जाय आसतलें (खास करून Chrome सद्या घटकांचेरूय लक्ष केंद्रीत करता tabindex="-1"
जेन्ना ते माऊसान क्लिक करतात) कडेन #content:focus { outline: none; }
.
लक्षांत दवरात की हो बग तुमची साइट वापरत आशिल्ल्या हेर खंयच्याय पानांतल्या दुव्याचेरूय परिणाम करतलो, कीबोर्ड वापरप्यां खातीर ते निरुपयोगी करतले. तुमी दुवो लक्ष्य म्हणून काम करपी हेर सगळ्या नांवाच्या एंकरांक / तुटके वळखप्यांक असोच स्टॉप-गॅप निवारण जोडपाचो विचार करूंक शकतात.
शीर्षकां ( <h1>
- <h6>
) नेस्ट करतना, तुमचो प्राथमीक दस्तावेज शीर्षक एक आसपाक जाय <h1>
. उपरांतच्या शीर्षकांनी तार्कीक वापर करचो <h2>
- <h6>
अशे तरेन स्क्रीन रीडर तुमच्या पानांक आशय कोश्टक तयार करूंक शकतात.
HTML CodeSniffer आनी Penn State ची AccessAbility हांगा चड जाणून घेयात .
सद्या, बूटस्ट्रॅपांत उपलब्ध आशिल्ले कांय मुलभूत रंग संयोजन (देखीक वेगवेगळे शैलीचे बटण वर्ग, मुळाव्या कोड ब्लॉकांखातीर वापरिल्ले कांय कोड हायलाइट करपी रंग , .bg-primary
संदर्भ पार्श्वभूंय मदतगार वर्ग, आनी धव्या पार्श्वभूमीचेर वापरल्यार मुलभूत दुवो रंग) विपरीतताय प्रमाण उणें आसता ( शिफारस केल्ल्या प्रमाणा सकयल ४.५:१ ). हाका लागून उण्या नदर आशिल्ल्या वा रंग कुड्डे आशिल्ल्या वापरप्यांक समस्या निर्माण जावंक शकतात. ह्या मुलभूत रंगांनी तांचे विपरीतताय आनी वाचपाची तांक वाडोवपाखातीर बदल करचे पडूं येतात.
बूटस्ट्रॅप एमआयटी परवान्या खाला सोडला आनी ताचो कॉपीराइट 2016 ट्विटर आसा. ल्हान ल्हान कुडक्यांनी उकडून दवरल्यार ताचें वर्णन सकयल दिल्ल्या अटींनी करूं येता.
चड म्हायती खातीर पुराय बूटस्ट्रॅप परवानो प्रकल्प रिपॉझिटरींत आसा.
समुदाय वांगड्यांनी Bootstrap च्या दस्तावेजीकरणाचें वेगवेगळ्या भाशांनी अणकारीत केलां. कोणाक अधिकृतपणान तेंको ना आनी ते सदांच अद्ययावत नासूं येतात.
आमी अणकार संघटीत करपाक वा येजमानकी दिवपाक मदत करिनात, आमी फकत तांकां लिंक करतात.
नवो वा ताचे परस बरो अणकार सोंपयला? आमच्या वळेरेंत जोडपाक एक पुल विनंती उगडात.