بوٽ اسٽريپ وڌائڻ

شامل ڪيل اندازن ۽ اجزاء جو فائدو وٺڻ لاءِ بوٽ اسٽريپ کي وڌايو، گڏوگڏ گھٽ متغير ۽ ميڪسين.

گھٽ CSS

بوٽ اسٽريپ LESS سان ٺهيل آهي بنيادي طور تي، هڪ متحرڪ اسٽائل شيٽ ٻولي جيڪا اسان جي سٺي دوست، Alexis Sellier پاران ٺاهي وئي آهي . اهو ترقي ڪندڙ سسٽم تي ٻڌل CSS کي تيز، آسان ۽ وڌيڪ مزو ڏئي ٿو.

ڇو گهٽ؟

بوٽ اسٽريپ جي تخليق ڪندڙن مان هڪ هن بابت هڪ تڪڙو بلاگ پوسٽ لکيو ، هتي خلاصو:

  • بوٽ اسٽريپ تيز ~ 6x تيز مرتب ڪري ٿو ساس جي مقابلي ۾ گھٽ سان
  • جاوا اسڪرپٽ ۾ گهٽ لکيو ويو آهي، ساس سان روبي جي مقابلي ۾ اسان کي ڊيو ڪرڻ ۽ پيچ ڪرڻ آسان بڻائي ٿي.
  • گهٽ آهي وڌيڪ؛ اسان محسوس ڪرڻ چاهيون ٿا ته اسان سي ايس ايس لکي رهيا آهيون ۽ بوٽ اسٽريپ کي سڀني جي قابل بڻائي رهيا آهيون.

ڇا شامل آهي؟

CSS جي توسيع جي طور تي، LESS ۾ متغير شامل آهن، ڪوڊ جي ٻيهر استعمال لائق اسنپٽس لاءِ ميڪسين، سادي رياضي لاءِ آپريشن، nesting، ۽ حتي رنگ جا ڪم.

وڌيڪ سکو

وڌيڪ سکڻ لاءِ سرڪاري ويب سائيٽ http://lesscss.org/ تي وڃو.

جيئن ته اسان جو سي ايس ايس گهٽ سان لکيو ويو آهي ۽ متغير ۽ ميڪسين کي استعمال ڪري ٿو، ان کي حتمي پيداوار جي عمل درآمد لاء مرتب ڪرڻ جي ضرورت آهي. هتي ڪيئن آهي.

نوٽ: جيڪڏهن توهان تبديل ٿيل CSS سان GitHub ڏانهن ڇڪڻ جي درخواست جمع ڪري رهيا آهيو، توهان کي انهن طريقن مان ڪنهن به ذريعي CSS کي ٻيهر ترتيب ڏيڻ گهرجي .

گڏ ڪرڻ جو اوزار

ڪمانڊ لائن

ڪمانڊ لائن ذريعي گڏ ڪرڻ لاءِ GitHub تي پروجيڪٽ readme ۾ ڏنل هدايتن تي عمل ڪريو .

جاوا اسڪرپٽ

جديد Less.js ڊائون لوڊ ڪريو ۽ ان ۾ رستو شامل ڪريو (۽ بوٽ اسٽراپ) <head>.

<link rel = "stylesheet /less" href = "/path/to/bootstrap.less" > <script src = "/path/to/less.js" ></script>  
 

.less فائلن کي ٻيهر گڏ ڪرڻ لاء، صرف انهن کي محفوظ ڪريو ۽ پنهنجو صفحو ٻيهر لوڊ ڪريو. Less.js انهن کي گڏ ڪري ٿو ۽ انهن کي مقامي اسٽوريج ۾ محفوظ ڪري ٿو.

غير رسمي ميڪ ايپ

غير رسمي ميڪ ايپ .less فائلن جي ڊائريڪٽري کي ڏسي ٿي ۽ ڪوڊ کي مقامي فائلن ۾ گڏ ڪري ٿي، هر هڪ .less فائل کي محفوظ ڪرڻ کان پوءِ. جيڪڏھن توھان چاھيو، توھان ترجيحات کي ٽوگل ڪري سگھو ٿا ايپ ۾ خودڪار گھٽائڻ لاءِ ۽ ڪھڙي ڊاريڪٽري ۾ مرتب ٿيل فائلون ختم ٿين ٿيون.

وڌيڪ ايپس

ڪڪڙ

Crunch Adobe Air تي ٺهيل هڪ بهترين ڏسندڙ LESS ايڊيٽر ۽ مرتب ڪندڙ آهي.

ڪوڊ ڪٽ

ساڳئي ماڻهوءَ پاران ٺاهيل غير رسمي Mac ايپ، CodeKit هڪ Mac ايپ آهي جيڪا LESS، SASS، Stylus، ۽ CoffeeScript کي گڏ ڪري ٿي.

سادو

ميڪ، لينڪس، ۽ ونڊوز ايپ ڊريگ ۽ ڊراپ گڏ ڪرڻ لاءِ گھٽ فائلون. پلس، ماخذ ڪوڊ GitHub تي آهي .

ڪنهن به ويب پروجيڪٽ کي جلدي شروع ڪريو مرتب ڪيل يا گھٽ ۾ گھٽ CSS ۽ JS ۾ ڇڏڻ سان. آسان اپ گريڊ ۽ سار سنڀال لاءِ الڳ الڳ ڪسٽم اسٽائل تي پرت اڳتي وڌڻ.

فائل جي جوڙجڪ کي ترتيب ڏيو

ڊائون لوڊ ڪريو تازو مرتب ٿيل بوٽ اسٽراپ ۽ پنھنجي پروجيڪٽ ۾ جڳھ ڪريو. مثال طور، توھان وٽ ڪجھھ ھجي سگھي ٿو:

  ايپ/
      ترتيب/
      ٽيمپليٽ/
  عوامي/
      css/
          bootstrap.min.css
      جي ايس/
          bootstrap.min.js
      img/
          glyphicons-halflings.png
          glyphicons-halflings-white.png

اسٽارٽر ٽيمپليٽ استعمال ڪريو

شروع ڪرڻ لاءِ ھيٺ ڏنل بنيادي HTML کي نقل ڪريو.

  1. <html>
  2. <سر>
  3. <title> Bootstrap 101 Template </title>
  4. <!-- بوٽ اسٽريپ -->
  5. <link href = "public/css/bootstrap.min.css" rel = "stylesheet" >
  6. </head>
  7. <جسم>
  8. <h1> هيلو، دنيا! </h1>
  9. <!-- بوٽ اسٽريپ -->
  10. <script src = "public/js/bootstrap.min.js" ></script>
  11. </body>
  12. </html>

ڪسٽم ڪوڊ تي پرت

توهان جي ڪسٽم CSS، JS، ۽ وڌيڪ ۾ ڪم ڪريو جيئن ته بوٽ اسٽريپ کي توهان جي پنهنجي الڳ CSS ۽ JS فائلن سان ٺاهيو.

  1. <html>
  2. <سر>
  3. <title> Bootstrap 101 Template </title>
  4. <!-- بوٽ اسٽريپ -->
  5. <link href = "public/css/bootstrap.min.css" rel = "stylesheet" >
  6. <!-- پروجيڪٽ -->
  7. <link href = "public/css/application.css" rel = "stylesheet" >
  8. </head>
  9. <جسم>
  10. <h1> هيلو، دنيا! </h1>
  11. <!-- بوٽ اسٽريپ -->
  12. <script src = "public/js/bootstrap.min.js" ></script>
  13. <!-- پروجيڪٽ -->
  14. <script src = "public/js/application.js" ></script>
  15. </body>
  16. </html>