مواد پر جائیں
مدد
اردو
اسٹور بلڈر

گروپ، متن، اور تقسیم کار بلاکس: لے آؤٹ اجزاء کی ترتیبات کیسے کام کرتی ہیں؟

بلڈر میں ہر گروپ، متن، اور تقسیم کار کی ترتیب: سمت، پوزیشن اور سیدھ، درمیان، چوڑائی، فاصلہ، رنگ اسکیم، کنارہ، اوور لے، پری سیٹس، لائن کی اونچائی، موٹائی، لمبائی، اور پیڈنگ کی حدود۔

جائزہ

بلڈر میں تقریباً ہر سیکشن میں تین قابل دوبارہ استعمال لے آؤٹ اجزاء نمودار ہوتے ہیں: گروپ، متن، اور تقسیم کار۔ یہ مل کر آپ کو CSS لکھے بغیر کوئی بھی لے آؤٹ بنانے دیتے ہیں۔ اس کی ترتیبات کھولنے کے لیے کوئی بلاک منتخب کریں۔

گروپ

گروپ ایک لچک دار لے آؤٹ کنٹینر ہے۔ اس کے اندر چائلڈ بلاکس شامل کریں (متن، بٹن، تصاویر، نیوز لیٹر ان پٹس، حتیٰ کہ نیسٹڈ گروپس) اور کنٹرول کریں کہ وہ کیسے ترتیب دیے جاتے ہیں۔

سمت

  • عمودی: چائلڈز اوپر سے نیچے ترتیب میں لگتے ہیں۔
  • افقی: چائلڈز ایک قطار میں ساتھ ساتھ بیٹھتے ہیں۔

موبائل پر عمودی طور پر ترتیب دیں ٹوگل صرف اس وقت نمودار ہوتا ہے جب سمت افقی ہو۔ اسے آن کریں تاکہ چھوٹی اسکرینوں پر ایک افقی قطار کو عمودی ترتیب میں بدل دیں۔

پوزیشن اور سیدھ

یہ چائلڈز کو مرکزی اور عرضی محور کے ساتھ تقسیم کرتے ہیں۔ ان کا مفہوم سمت کے ساتھ بدل جاتا ہے، اور درمیان اختیار (چائلڈز کے درمیان برابر جگہ) صرف مرکزی محور پر موجود ہوتا ہے:

  • عمودی سمت: پوزیشن مرکزی (عمودی) محور ہے: اوپر، مرکز، نیچے، یا درمیان۔ سیدھ عرضی (افقی) محور ہے: بائیں، مرکز، یا دائیں۔
  • افقی سمت: سیدھ مرکزی (افقی) محور ہے: بائیں، مرکز، دائیں، یا درمیان۔ پوزیشن عرضی (عمودی) محور ہے: اوپر، مرکز، یا نیچے۔

چوڑائی

  • فل: والد میں تمام دستیاب جگہ لینے کے لیے پھیلتا ہے۔ اسے ان گروپس کے لیے استعمال کریں جنہیں ایک افقی والد کے اندر جگہ کا برابر اشتراک کرنا چاہیے۔
  • فٹ: اپنے مواد کے قدرتی سائز تک سکڑتا ہے۔
  • حسب ضرورت: ایک حسب ضرورت چوڑائی سلائیڈر ظاہر کرتا ہے جو فیصد کے طور پر مقرر ہوتا ہے (0 سے 100%)۔ گروپ اس سائز کو بڑھے یا سکڑے بغیر برقرار رکھتا ہے۔

فاصلہ

چائلڈ عناصر کے درمیان پکسلز میں فاصلہ (0 سے 100 px، ڈیفالٹ 20 px)۔

رنگ اسکیم

والد کی رنگ اسکیم استعمال کریں ڈیفالٹ کے طور پر آن ہے، چنانچہ گروپ اپنے والد کی اسکیم وراثت میں لیتا ہے۔ اسے آف کریں تاکہ رنگ اسکیم منتخب کنندہ ظاہر ہو اور اپنی عالمی رنگ اسکیموں میں سے ایک منتخب کریں۔ یہ آپ کو ایک سیکشن کے اندر الگ رنگ زون بنانے دیتا ہے۔

کنارہ

کنارہکوئی نہیں یا ٹھوس ہے۔ ٹھوس دو سلائیڈر ظاہر کرتا ہے: کنارے کی موٹائی (1 سے 20 px، ڈیفالٹ 1) اور کنارے کی اوپیسیٹی (0 سے 100%، ڈیفالٹ 100)۔ رنگ فعال اسکیم کے کنارے کے رنگ سے آتا ہے۔

کنارے کی گولائی

پکسلز میں کنارے کی گولائی (0 سے 100)، کنارے سے آزاد۔ اسے کارڈ نما کنٹینرز کے لیے استعمال کریں۔

پس منظر اوور لے

پس منظر اوور لے ٹوگل گروپ کے پس منظر کے اوپر ایک رنگین تہہ جوڑتا ہے۔ جب آن ہو، تو اوور لے رنگ (منتخب کنندہ کے اوپیسیٹی سلائیڈر کے ذریعے شفافیت سمیت)، اوور لے انداز (ٹھوس فلیٹ بھرائی یا گریڈینٹ جو شفاف ہو جاتا ہے)، اور گریڈینٹ کے لیے گریڈینٹ سمت (اوپر یا نیچے) مقرر کریں۔ عام طور پر کسی میڈیا پس منظر کو رنگ دینے کے لیے استعمال ہوتا ہے۔

پیڈنگ

ہر طرف پکسلز میں اندرونی فاصلہ، ہر ایک 0 سے 100 px۔ پیڈنگ کنارے کے اندر، اس کے اور چائلڈز کے درمیان بیٹھتی ہے۔

متن

متن کا بلاک سرخیاں، پیراگراف، اور فارمیٹ شدہ متن رینڈر کرتا ہے۔ رِچ ٹیکسٹ ایڈیٹر بولڈ، اِٹالک، انڈر لائن، اسٹرائیک تھرو، اور رنگین متن کی حمایت کرتا ہے۔

پری سیٹ

ٹائپوگرافی پری سیٹ فونٹ فیملی، ڈیفالٹ وزن، اور سیمینٹک HTML ٹیگ (صفحے پر اس کا کردار) مقرر کرتا ہے:

  • ڈیفالٹ: سیکشن کا بنیادی متن انداز وراثت میں لیتا ہے۔
  • پیراگراف: متن کا انداز۔
  • سرخی 1 سے سرخی 6 تک: سرخی کے انداز، آپ کے سرخی اور ذیلی سرخی کے فونٹس استعمال کرتے ہیں۔

سائز

پکسلز میں ایک حسب ضرورت فونٹ سائز (10 سے 30 px، ڈیفالٹ 16)۔ یہ وہ سائز ہے جس پر بلاک دراصل رینڈر ہوتا ہے۔

چوڑائی اور سیدھ

  • فٹ: بلاک صرف اپنے مواد جتنا چوڑا ہوتا ہے۔
  • فل: بلاک کنٹینر کی چوڑائی کے 100% تک پھیلتا ہے۔

سیدھ (بائیں، مرکز، دائیں) صرف اس وقت نمودار ہوتی ہے جب چوڑائی فل پر مقرر ہو، کیونکہ سیدھ صرف اسی وقت بامعنی ہوتی ہے جب بلاک اپنے کنٹینر کو بھرتا ہے۔

لائن کی اونچائی اور حروف کا فاصلہ

لائن کی اونچائی عمودی تال مقرر کرتی ہے: نارمل (ڈیفالٹ)، تنگ، یا کھلا۔ حروف کا فاصلہ انہی تین اختیارات کے ساتھ حروف کا فاصلہ مقرر کرتا ہے۔

رنگ اسکیم

کسی گروپ کے اندر، والد کی رنگ اسکیم استعمال کریں ڈیفالٹ کے طور پر آن ہے۔ اسے آف کریں تاکہ رنگ اسکیم منتخب کنندہ ظاہر ہو۔ سرخی پری سیٹس اسکیم کا سرخی کا رنگ استعمال کرتے ہیں؛ پیراگراف اور ڈیفالٹ اس کا متن کا رنگ استعمال کرتے ہیں۔ ایک خود مختار سیکشن کے طور پر، منتخب کنندہ بغیر کسی وراثت ٹوگل کے اکیلا کھڑا ہوتا ہے۔

پیڈنگ

ہر طرف پکسلز میں اندرونی فاصلہ، ہر ایک 0 سے 100 px۔

تقسیم کار

ایک جدا کرنے والی لکیر جو اپنے والد کے مطابق ڈھلتی ہے۔ ایک عمودی (کالم) لے آؤٹ میں یہ ایک افقی لکیر ہوتی ہے؛ کسی افقی گروپ کے اندر یہ ایک عمودی لکیر بن جاتی ہے۔

چوڑائی

  • فٹ: کنٹینر صرف لکیر جتنا چوڑا ہوتا ہے۔
  • فل: کنٹینر دستیاب جگہ بھرنے کے لیے پھیلتا ہے۔

موٹائی

پکسلز میں لکیر کی موٹائی (1 سے 10 px، ڈیفالٹ 1)۔ ایک افقی تقسیم کار کے لیے یہ اونچائی ہے؛ ایک عمودی کے لیے یہ چوڑائی ہے۔

لمبائی

اپنے کنٹینر کے فیصد کے طور پر لکیر کا پھیلاؤ (5 سے 100%، ڈیفالٹ 100)۔ ایک جزوی، اندر دھنسی لکیر بنانے کے لیے اسے 100% سے نیچے مقرر کریں۔

سیدھ

جب لکیر کی لمبائی 100% سے کم ہو تو لکیر کو ترتیب دیتا ہے: آغاز، مرکز (ڈیفالٹ)، یا اختتام۔ یہ کنٹرول اس وقت چھپا رہتا ہے جب لمبائی 100% ہو۔

کنارے کی گولائی

  • تیز: مستطیل سرے۔
  • گول: گولی نما سرے۔

رنگ اسکیم

اختیاری طور پر ایک رنگ اسکیم منتخب کریں۔ تقسیم کار اس اسکیم کے کنارے کا رنگ استعمال کرتا ہے۔ اگر کوئی مقرر نہ ہو، تو یہ والد سیکشن یا گروپ سے رنگ وراثت میں لیتا ہے۔

پیڈنگ

ہر طرف پکسلز میں فاصلہ۔ ایک بلاک کے طور پر دائرہ 0 سے 100 px ہے۔ جب تقسیم کار ایک اعلیٰ درجے کے سیکشن کے طور پر شامل کیا جاتا ہے، تو زیادہ فراخ عمودی گنجائش کے لیے پیڈنگ 200 px (ڈیفالٹ 20) تک جاتی ہے۔

عام نقصانات

  • ایک افقی والد کے اندر دو فل گروپس: ہر ایک جگہ کا 50% لیتا ہے، جو عام طور پر آپ کی مطلوبہ چیز ہے۔ ایک طرف کو چوڑا بنانے کے لیے، اس گروپ کی چوڑائی کو حسب ضرورت پر مقرر کریں۔
  • عمودی تقسیم کار نمودار نہ ہونا: ایک تقسیم کار صرف اس وقت عمودی ہوتا ہے جب یہ افقی سمت پر مقرر کسی گروپ کا براہ راست چائلڈ ہو۔ والد گروپ کی سمت جانچیں۔
  • درمیان اختیار غائب: درمیان صرف اسی محور پر نمودار ہوتا ہے جس کے ساتھ چائلڈز بہتے ہیں، چنانچہ یہ عمودی گروپس کے لیے پوزیشن پر اور افقی گروپس کے لیے سیدھ پر ہے۔
  • متن غلط رنگ میں: یہ غالباً مختلف اسکیم والے کسی والد گروپ سے وراثت میں لے رہا ہے۔ متن بلاک پر والد کی رنگ اسکیم استعمال کریں آف کریں اور اسکیم واضح طور پر منتخب کریں۔

یہ اجزاء کہاں رکھے جا سکتے ہیں اس کے لیے، سیکشنز اور بلاکس دیکھیں۔