میں متن کو کیسے سنٹر کر سکتا ہوں (افقی اور عمودی طور پر) div کے اندر

My Mtn Kw Kys Sn R Kr Skta W Afqy Awr Mwdy Twr Pr Div K Andr



ویب صفحات کو ڈیزائن کرتے وقت، ڈویلپر مختلف اجزاء شامل کر سکتے ہیں، بشمول تصاویر، متن، میزیں اور دیگر۔ مزید برآں، متن کو ایک سے زیادہ CSS خصوصیات کا استعمال کرتے ہوئے ایک div میں مرکز میں منسلک کیا جا سکتا ہے۔ متن کو افقی طور پر مرکز کرنے کا سب سے مشہور طریقہ یہ ہے کہ ' متن سیدھ ' وصف. مزید یہ کہ آپ ' لکیر کی اونچائی 'اور' عمودی سیدھ متن کو عمودی طور پر سیدھ میں کرنے کے لیے خصوصیات۔

یہ پوسٹ متن کو عمودی اور افقی طور پر تقسیم کے اندر مرکز کرنے کا طریقہ بیان کرے گی۔







ایک div کے اندر متن کو افقی طور پر کیسے سنٹر کریں؟

متن کو ایک div کے اندر افقی طور پر مرکز کرنے کے لیے، دیئے گئے طریقہ کار کو چیک کریں۔



مرحلہ 1: ایک div کنٹینر بنائیں



ابتدائی طور پر، 'کی مدد سے ایک div کنٹینر بنائیں

' عنصر. پھر، ایک داخل کریں ' آئی ڈی ” div اوپننگ ٹیگ کے اندر انتساب۔ اس کے بعد، div ٹیگ کے درمیان کچھ متن ایمبیڈ کریں:





< div آئی ڈی = 'سیدھ میں آنے والا مواد' >
Linuxhint بہترین ویب سائٹس میں سے ایک ہے۔ کے لیے مواد کی تخلیق.
div >


آؤٹ پٹ


مرحلہ 2: div کنٹینر کو سینٹر الائن ٹیکسٹ تک رسائی حاصل کریں۔



اب، کی مدد سے div کنٹینر تک رسائی حاصل کریں۔ آئی ڈی 'انتخابی نام کے ساتھ سلیکٹر' # اور درج ذیل سی ایس ایس خصوصیات کو لاگو کریں:

# سیدھ کرنے والا مواد{
چوڑائی: 80 % ;
مارجن: 0 آٹو
پیڈنگ: 20px؛
پس منظر: #c8edf3;
متن سیدھ: مرکز؛
رنگ: آر جی بی ( 49 , پندرہ , 240 ) ;
}


یہاں:

    • ' چوڑائی ” پراپرٹی کا استعمال کنٹینر کی چوڑائی کا سائز مقرر کرنے کے لیے کیا جاتا ہے۔
    • ' مارجن ” کنٹینر کے باہر خالی جگہ کی وضاحت کرتا ہے۔
    • ' بھرتی ' عنصر کی حدود کے اندر ایک جگہ کی وضاحت کرتا ہے۔
    • ' پس منظر ” عنصر کے پچھلے حصے میں پس منظر کا رنگ سیٹ کرتا ہے۔
    • ' متن سیدھ 'پراپرٹی کو متن کی سیدھ میں ترتیب دینے کے لیے استعمال کیا جاتا ہے' مرکز '
    • ' رنگ باؤنڈری کے اندر متن کے لیے ایک رنگ بتاتا ہے۔

یہ مشاہدہ کیا جا سکتا ہے کہ ہم نے تخلیق کردہ div کے اندر کامیابی سے منسلک متن کو افقی طور پر مرکز کیا ہے:

متن کو عمودی طور پر div کے اندر کیسے سنٹر کریں؟

متن کو عمودی طور پر div کنٹینر کے اندر بیچنے کے لیے، فراہم کردہ ہدایات پر عمل کریں۔

مرحلہ 1: div کنٹینر تک رسائی حاصل کریں۔

سب سے پہلے، بنائے گئے div کنٹینر تک رسائی حاصل کریں۔

مرحلہ 2: مرکزی متن پر عمودی طور پر CSS خصوصیات کا اطلاق کریں۔

اس کے بعد، ذیل میں درج سی ایس ایس خصوصیات کو ایک div میں عمودی طور پر بیچ میں متن پر لاگو کریں:

# سیدھ کرنے والا مواد{
ڈسپلے: ٹیبل سیل؛
چوڑائی: 300px؛
اونچائی: 150px؛
پیڈنگ: 10px؛
رنگ: نیلا؛
پس منظر کا رنگ: rgb ( 248 , 215 , 166 ) ;
بارڈر: 3px ڈیشڈ #f09d03;
عمودی سیدھ: درمیانی؛
}


مندرجہ بالا کوڈ کے ٹکڑوں کے مطابق:

    • مقرر ' ڈسپلے 'جو عنصر کے ڈسپلے رویے کی وضاحت کرتا ہے' ٹیبل سیل ”، جس کا مطلب ہے کہ یہ div عنصر میں ٹیبل کے سیل کی طرح کام کرتا ہے۔
    • ' چوڑائی ' پراپرٹی عنصر کی چوڑائی کا سائز بتاتی ہے۔
    • ' اونچائی عنصر کی اونچائی کا تعین کرتا ہے۔
    • ' بھرتی عنصر کے اندر خالی جگہ کی وضاحت کرتا ہے۔
    • ' رنگ عنصر کے اندر متن کا رنگ ترتیب دینے کے لیے استعمال کیا جاتا ہے۔
    • ' پس منظر کا رنگ ' عنصر کے پچھلے حصے کے رنگ کی وضاحت کرتا ہے۔
    • ' سرحد 'پراپرٹی ایک عنصر پر ایک حد کی وضاحت کرتی ہے۔
    • ' عمودی سیدھ 'پراپرٹی کا استعمال ایک متعین عنصر کی عمودی سیدھ کو ترتیب دینے کے لیے کیا جاتا ہے' درمیانی '

آؤٹ پٹ


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

نتیجہ

متن کو ایک div کے اندر عمودی اور افقی طور پر مرکز کرنے کے لیے، پہلے

عنصر کی مدد سے ایک div کنٹینر بنائیں اور سلیکٹر کو استعمال کرکے اس تک رسائی حاصل کریں۔ پھر، سی ایس ایس کی خصوصیات کو لاگو کریں جس میں ' متن سیدھ ' جائیداد افقی سیدھ کے لیے استعمال کی جاتی ہے، اور ' عمودی سیدھ ” عمودی سیدھ سیٹ کرتا ہے۔ اس پوسٹ نے متن کو ایک div کے اندر عمودی اور افقی طور پر مرکز کرنے کے طریقوں کا مظاہرہ کیا۔