विस्तार · बूटस्ट्रैप मैथिली भाषा में

बूटस्ट्रैप अपन मूल में LESS के साथ बनाओल गेल अछि, एकटा गतिशील स्टाइलशीट भाषा जे हमर नीक दोस्त, Alexis Sellier द्वारा बनाओल गेल अछि . इ सिस्टम आधारित सीएसएस कें विकास कें तेज, आसान आ मजेदार बनायत छै.

कम कियैक ?

बूटस्ट्रैप के एकटा निर्माता एहि बारे में एकटा त्वरित ब्लॉग पोस्ट लिखने छथि , एतय संक्षेप में:

बूटस्ट्रैप Sass क तुलना मे Less क संग तेजी स ~6x तेजी स संकलित करैत अछि
जावास्क्रिप्ट मे कम लिखल गेल अछि, जाहि स हमरा सब कए रूबी विद सैस क तुलना मे गोता लगाबय आ पैच करब आसान भ गेल अछि।
कम बेसी अछि; हम ई महसूस करय चाहैत छी जे हम CSS लिखि रहल छी आ बूटस्ट्रैप के सबहक लेल सुलभ बना रहल छी.

की शामिल अछि ?

CSS कें विस्तार कें रूप मे, LESS मे चर, कोड कें पुन: उपयोग करय योग्य स्निपेट कें लेल मिक्सिन, सरल गणित, नेस्टिंग, आ यहां तक कि रंग फंक्शन कें लेल ऑपरेशन शामिल छै.

और जानें

अधिक जानय लेल आधिकारिक वेबसाइट http://lesscss.org/ पर जाउ.

चूँकि हमरऽ सीएसएस लेस स॑ लिखलऽ जाय छै आरू चर आरू मिक्सिन के उपयोग करै छै, एकरा अंतिम उत्पादन कार्यान्वयन लेली संकलित करै के जरूरत छै । एतय कोना।

नोट: यदि अहां संशोधित CSS कें साथ GitHub कें लेल कोनों पुल अनुरोध जमा करय रहल छी, त अहां कें अइ मे सं कोनों विधि कें माध्यम सं CSS कें पुनः संकलित करनाय होयत .

संकलन के लिये उपकरण

कमांड लाइन

कमांड लाइन कें माध्यम सं संकलन कें लेल GitHub पर प्रोजेक्ट readme मे देल गेल निर्देशक कें पालन करूं .

जावास्क्रिप्ट

नवीनतम Less.js डाउनलोड करू आओर एकर पथ (आ बूटस्ट्रैप) मे शामिल करू <head>.

<link rel = "स्टाइलशीट/कम" href = "/पथ/से/बूटस्ट्रैप.कम" > <script src = "/पथ/से/कम. js" ></script>

.less फाइलकेँ पुनः संकलित करबाक लेल, बस ओकरा सहेजू आ अपन पृष्ठकेँ पुनः लोड करू। Less.js ओकरा संकलित करयत छै आ ओकरा स्थानीय भंडारण मे संग्रहीत करयत छै.

अनौपचारिक मैक ऐप

अनौपचारिक मैक ऐप .less फाइल कें डायरेक्टरी कें देखयत छै आ देखल गेल .less फाइल कें हर सेव कें बाद कोड कें स्थानीय फाइल मे संकलित करयत छै. अगर अहां चाहय छी त अहां ऐप मे वरीयता कए ऑटोमैटिक मिनिफाइंग क लेल टॉगल क सकय छी आओर संकलित फाइल कोन डाइरेक्टरी मे खतम भ जाएत अछि.

और ऐप

क्रंच

क्रंच एडोब एयर पर बनल एकटा बढ़िया देखय वाला LESS एडिटर आ कंपाइलर अछि.

कोडकिट

अनौपचारिक मैक ऐप के समान लड़का द्वारा बनाओल गेल कोडकिट एकटा मैक ऐप अछि जे LESS, SASS, Stylus, आ CoffeeScript के संकलित करैत अछि |

सरलहीन

LESS फाइल कें ड्रैग आ ड्रॉप संकलन कें लेल मैक, लिनक्स, आ विंडोज ऐप. प्लस, स्रोत कोड GitHub पर अछि .

संकलित या लघुकृत सीएसएस आ जेएस मे छोड़ि क' कोनो वेब प्रोजेक्ट केँ जल्दी सँ शुरू करू . आगू बढ़ैत आसान अपग्रेड आ रखरखाव कें लेल कस्टम स्टाइल पर अलग सं लेयर करूं.

सेटअप फाइल संरचना

नवीनतम संकलित बूटस्ट्रैप डाउनलोड करू आ अपन प्रोजेक्ट मे राखू। जेना, अहाँक पास किछु एहन भ' सकैत अछि:

  एप्लिकेशन/
      लेआउट/ 1।
      टेम्पलेट्स/ 1।
  सार्वजनिक/
      सीएसएस/ 10।
          बूटस्ट्रैप.मिनट.सीएसएस
      जे एस / 1।
          बूटस्ट्रैप.मिन.जेएस
      img/ 1।
          ग्लिफिकॉन्स-हाफलिंग्स.पीएनजी
          ग्लिफिकॉन्स-हाफलिंग-सफेद.png

स्टार्टर टेम्पलेट का उपयोग करें

शुरू करबाक लेल निम्नलिखित बेस एचटीएमएल कॉपी करू.

<html>
  <सिर>
    <title> बूटस्ट्रैप 101 टेम्पलेट </title>
    <!-- बूटस्ट्रैप -->
    <link href = "सार्वजनिक/css/bootstrap.min.css" rel = "शैलीशीट" >  
  </head>
  <शरीर>
    <h1> नमस्कार, दुनियाँ! </h1>
    <!-- बूटस्ट्रैप -->
    <script src = "सार्वजनिक/जेएस/बूटस्ट्रैप.मिनट.जेएस" </script> 
  </शरीर>
</html>

कस्टम कोड पर परत

बूटस्ट्रैप कें अपन अलग-अलग CSS आ JS फाइल कें साथ अपन बनावा कें लेल आवश्यक रूप सं अपन कस्टम CSS, JS, आओर बेसि मे काज करूं.

<html>
  <सिर>
    <title> बूटस्ट्रैप 101 टेम्पलेट </title>
    <!-- बूटस्ट्रैप -->
    <link href = "सार्वजनिक/css/bootstrap.min.css" rel = "शैलीशीट" >  
    <!-- परियोजना -->
    <link href = "सार्वजनिक/css/अनुप्रयोग.css" rel = "शैलीशीट" >  
  </head>
  <शरीर>
    <h1> नमस्कार, दुनियाँ! </h1>
    <!-- बूटस्ट्रैप -->
    <script src = "सार्वजनिक/जेएस/बूटस्ट्रैप.मिनट.जेएस" </script> 
    <!-- परियोजना -->
    <script src = "सार्वजनिक / जे एस / अनुप्रयोग.जे एस" </script> 
  </शरीर>
</html>

बूटस्ट्रैप के विस्तार करब

LESS के साथ निर्मित