بڑھائیں · بوٹسٹریپ اردو میں

بوٹسٹریپ کو اس کے بنیادی حصے میں LESS کے ساتھ بنایا گیا ہے، یہ ایک متحرک اسٹائل شیٹ زبان ہے جسے ہمارے اچھے دوست، Alexis Sellier نے بنایا ہے۔ یہ ڈیولپنگ سسٹم پر مبنی CSS کو تیز تر، آسان اور مزید تفریحی بناتا ہے۔

کیوں کم؟

بوٹسٹریپ کے تخلیق کاروں میں سے ایک نے اس بارے میں ایک فوری بلاگ پوسٹ لکھی ، جس کا خلاصہ یہاں دیا گیا ہے:

بوٹسٹریپ Sass کے مقابلے کم کے ساتھ ~ 6x تیزی سے مرتب کرتا ہے۔
جاوا اسکرپٹ میں کم لکھا جاتا ہے، جس سے روبی کے ساتھ ساس کے مقابلے میں ڈائیونگ اور پیچ کرنا آسان ہوجاتا ہے۔
کم زیادہ ہے؛ ہم محسوس کرنا چاہتے ہیں کہ ہم CSS لکھ رہے ہیں اور بوٹسٹریپ کو سب کے لیے قابل رسائی بنا رہے ہیں۔

کیا شامل ہے؟

CSS کی توسیع کے طور پر، LESS میں متغیرات، کوڈ کے دوبارہ قابل استعمال ٹکڑوں کے لیے مکسز، سادہ ریاضی کے لیے آپریشنز، نیسٹنگ، اور یہاں تک کہ رنگ کے افعال شامل ہیں۔

اورجانیے

مزید جاننے کے لیے سرکاری ویب سائٹ http://lesscss.org/ پر جائیں۔

چونکہ ہمارا CSS کم کے ساتھ لکھا گیا ہے اور متغیرات اور مکسنس کا استعمال کرتا ہے، اس لیے اسے حتمی پیداوار کے نفاذ کے لیے مرتب کرنے کی ضرورت ہے۔ یہ ہے کیسے۔

نوٹ: اگر آپ ترمیم شدہ CSS کے ساتھ GitHub پر پل کی درخواست جمع کر رہے ہیں، تو آپ کو ان طریقوں میں سے کسی کے ذریعے CSS کو دوبارہ مرتب کرنا ہوگا ۔

مرتب کرنے کے اوزار

کمانڈ لائن

کمانڈ لائن کے ذریعے مرتب کرنے کے لیے گٹ ہب پر پروجیکٹ ریڈمی میں دی گئی ہدایات پر عمل کریں ۔

جاوا اسکرپٹ

تازہ ترین Less.js ڈاؤن لوڈ کریں اور اس کا راستہ (اور بوٹسٹریپ) میں شامل کریں <head>۔

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

.less فائلوں کو دوبارہ مرتب کرنے کے لیے، بس انہیں محفوظ کریں اور اپنا صفحہ دوبارہ لوڈ کریں۔ Less.js انہیں مرتب کرتا ہے اور انہیں مقامی اسٹوریج میں اسٹور کرتا ہے۔

غیر سرکاری میک ایپ

غیر سرکاری میک ایپ .less فائلوں کی ڈائرکٹری دیکھتی ہے اور دیکھی گئی .less فائل کے ہر محفوظ کرنے کے بعد کوڈ کو مقامی فائلوں میں مرتب کرتی ہے۔ اگر آپ چاہیں تو، آپ خودکار منفائنگ کے لیے ایپ میں ترجیحات کو ٹوگل کر سکتے ہیں اور مرتب کی گئی فائلیں کس ڈائرکٹری میں ختم ہوتی ہیں۔

زیادہ اطلاقات

کرنچ

کرنچ ایک بہترین نظر آنے والا کم ایڈیٹر اور کمپائلر ہے جو ایڈوب ایئر پر بنایا گیا ہے۔

کوڈ کٹ

غیر سرکاری Mac ایپ کے طور پر اسی آدمی کے ذریعہ تخلیق کیا گیا، CodeKit ایک Mac ایپ ہے جو LESS، SASS، Stylus، اور CoffeeScript کو مرتب کرتی ہے۔

سادہ

کم فائلوں کو ڈریگ اینڈ ڈراپ کمپائل کرنے کے لیے میک، لینکس اور ونڈوز ایپ۔ اس کے علاوہ، سورس کوڈ GitHub پر ہے ۔

کسی بھی ویب پروجیکٹ کو کمپائلڈ یا minified CSS اور JS میں چھوڑ کر جلدی سے شروع کریں۔ آگے بڑھنے میں آسان اپ گریڈ اور دیکھ بھال کے لیے الگ سے حسب ضرورت اسٹائل پر تہہ لگائیں۔

فائل کا ڈھانچہ ترتیب دیں۔

تازہ ترین مرتب شدہ بوٹسٹریپ ڈاؤن لوڈ کریں اور اپنے پروجیکٹ میں رکھیں۔ مثال کے طور پر، آپ کے پاس کچھ ایسا ہو سکتا ہے:

  ایپ/
      لے آؤٹ/
      ٹیمپلیٹس/
  عوام/
      css/
          bootstrap.min.css
      js/
          bootstrap.min.js
      img/
          glyphicons-halflings.png
          glyphicons-halflings-white.png

اسٹارٹر ٹیمپلیٹ کا استعمال کریں۔

شروع کرنے کے لیے درج ذیل بیس ایچ ٹی ایم ایل کو کاپی کریں۔

<html>
  <head>
    <title> بوٹسٹریپ 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> بوٹسٹریپ 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>

بوٹسٹریپ کو بڑھانا

کم کے ساتھ بنایا گیا ہے۔