समाविष्ट शैली आणि घटक, तसेच कमी व्हेरिएबल्स आणि मिक्सन्सचा लाभ घेण्यासाठी बूटस्ट्रॅप वाढवा.
बूटस्ट्रॅप त्याच्या मूळ भागावर LESS ने बनवलेला आहे, आमचा चांगला मित्र, Alexis Sellier ने तयार केलेली डायनॅमिक स्टाइलशीट भाषा . हे विकसित सिस्टम-आधारित CSS जलद, सोपे आणि अधिक मनोरंजक बनवते.
बूटस्ट्रॅपच्या निर्मात्यांपैकी एकाने याबद्दल एक द्रुत ब्लॉग पोस्ट लिहिली आहे , त्याचा सारांश येथे आहे:
CSS चा विस्तार म्हणून, LESS मध्ये व्हेरिएबल्स, कोडच्या पुन्हा वापरता येण्याजोग्या स्निपेट्ससाठी मिक्सिन्स, साध्या गणितासाठी ऑपरेशन्स, नेस्टिंग आणि अगदी कलर फंक्शन्स समाविष्ट आहेत.
अधिक जाणून घेण्यासाठी http://lesscss.org/ येथे अधिकृत वेबसाइटला भेट द्या .
आमचे CSS कमी ने लिहिलेले असल्यामुळे आणि व्हेरिएबल्स आणि मिक्सिनचा वापर करते, अंतिम उत्पादन अंमलबजावणीसाठी ते संकलित करणे आवश्यक आहे. कसे ते येथे आहे.
कमांड लाइनद्वारे संकलित करण्यासाठी गिटहबवरील प्रोजेक्ट रीडमीमधील सूचनांचे अनुसरण करा .
नवीनतम Less.js डाउनलोड करा आणि त्यात त्याचा मार्ग (आणि बूटस्ट्रॅप) समाविष्ट करा <head>
.
<link rel = "stylesheet/less" href = "/path/to/bootstrap.less" > <script src = "/path/to/less.js" ></script>
.less फाइल्स पुन्हा संकलित करण्यासाठी, फक्त त्या जतन करा आणि तुमचे पृष्ठ रीलोड करा. Less.js त्यांना संकलित करते आणि स्थानिक स्टोरेजमध्ये संग्रहित करते.
अनधिकृत Mac अॅप .less फाइल्सच्या डिरेक्टरी पाहतो आणि पाहिल्या गेलेल्या .less फाइलच्या प्रत्येक सेव्हनंतर स्थानिक फाइल्समध्ये कोड संकलित करतो. तुम्हाला आवडत असल्यास, तुम्ही अॅपमध्ये स्वयंचलित लघुकरणासाठी प्राधान्ये टॉगल करू शकता आणि संकलित फायली कोणत्या निर्देशिकेत संपतात.
Crunch हा Adobe Air वर तयार केलेला एक उत्कृष्ट दिसणारा कमी संपादक आणि कंपाइलर आहे.
अनधिकृत Mac अॅप सारख्याच व्यक्तीने तयार केलेले, CodeKit एक Mac अॅप आहे जे LESS, SASS, Stylus आणि CoffeeScript संकलित करते.
कमी फाइल्सच्या ड्रॅग आणि ड्रॉप संकलित करण्यासाठी Mac, Linux आणि Windows अॅप. शिवाय, स्त्रोत कोड GitHub वर आहे .
संकलित किंवा मिनिफाइड CSS आणि JS मध्ये टाकून कोणताही वेब प्रोजेक्ट त्वरीत सुरू करा. सुलभ अपग्रेड आणि देखभाल पुढे जाण्यासाठी सानुकूल शैलींवर स्वतंत्रपणे स्तर करा.
नवीनतम संकलित बूटस्ट्रॅप डाउनलोड करा आणि आपल्या प्रकल्पात ठेवा. उदाहरणार्थ, आपल्याकडे असे काहीतरी असू शकते:
अॅप/ मांडणी/ टेम्पलेट्स/ सार्वजनिक/ css/ bootstrap.min.css js/ bootstrap.min.js img/ glyphicons-halflings.png glyphicons-halflings-white.png
प्रारंभ करण्यासाठी खालील बेस HTML कॉपी करा.
- <html>
- <head>
- <title> Bootstrap 101 टेम्पलेट </title>
- <!-- बूटस्ट्रॅप -->
- <link href = "public/css/bootstrap.min.css" rel = "stylesheet" >
- </head>
- <body>
- <h1> नमस्कार, जगा! </h1>
- <!-- बूटस्ट्रॅप -->
- <script src = "public/js/bootstrap.min.js" ></script>
- </body>
- </html>
तुमच्या स्वतःच्या CSS आणि JS फायलींसह बूटस्ट्रॅपला तुमचा स्वतःचा बनवण्यासाठी तुमच्या सानुकूल CSS, JS आणि अधिकमध्ये काम करा.
- <html>
- <head>
- <title> Bootstrap 101 टेम्पलेट </title>
- <!-- बूटस्ट्रॅप -->
- <link href = "public/css/bootstrap.min.css" rel = "stylesheet" >
- <!-- प्रकल्प -->
- <link href = "public/css/application.css" rel = "stylesheet" >
- </head>
- <body>
- <h1> नमस्कार, जगा! </h1>
- <!-- बूटस्ट्रॅप -->
- <script src = "public/js/bootstrap.min.js" ></script>
- <!-- प्रकल्प -->
- <script src = "public/js/application.js" ></script>
- </body>
- </html>