سی ایس ایس فلوٹ کو سمجھنا

سی ایس ایس کا استعمال کرتے ہوئے پراپرٹیز ڈیزائن ویب پیج لے آؤٹ

سی ایس ایس کی جائیداد ترتیب کے لئے بہت اہم املاک ہے. یہ آپ کو آپ کے ویب صفحہ کے ڈیزائن کو یقینی طور پر پیش کرنے کی اجازت دیتا ہے جیسے آپ ان کو ظاہر کرنا چاہتے ہیں- لیکن اس کا استعمال کرنے کے لۓ آپ کو یہ سمجھنا ہوگا کہ یہ کیسے کام کرتا ہے.

ایک طرز شیٹ میں، سی ایس ایس فلوٹ پراپرٹی اس طرح لگ رہا ہے:

صحیح. فلوٹ: دائیں؛ }

یہ براؤزر کو بتاتی ہے کہ "دائیں" کی کلاس کے ساتھ سب کچھ دائیں طرف طے کیا جانا چاہئے.

آپ اسے اس طرح تفویض کریں گے:

کلاس = "صحیح" />

پراپرٹی کے حقوق دیگر مز؛ د معلومات * سکیورٹی کوڈ یہاں 5-سکیورٹی کوڈ داخل کریں.

آپ ویب عنصر پر ہر عنصر کو فلوٹ نہیں کر سکتے ہیں. آپ صرف بلاک سطح کے عناصر کو فلوٹ کرسکتے ہیں. یہ ایسے عناصر ہیں جو صفحہ پر جگہ کا ایک بلاک بناتے ہیں، جیسے تصاویر ()، پیراگراف ()، ڈویژن ()، اور فہرست ().

دیگر عناصر جو متن پر اثر انداز کرتے ہیں، لیکن صفحے پر ایک باکس تیار نہیں کرتے ان لائن عناصر کو بھی کہا جاتا ہے اور اسے طول نہیں کیا جاسکتا ہے. یہ عناصر (یعنی)، لائن وقفے ()، مضبوط زور ()، یا اطالوی () جیسے عناصر ہیں.

وہ کہاں چلے گئے ہیں

آپ کو دائیں یا بائیں طرف عناصر کو فلوٹ کر سکتے ہیں. کسی بھی عنصر جو فلوٹ عنصر کی پیروی کرتا ہے وہ دوسری طرف فلوڈ عنصر کے گرد بہاؤ گا.

مثال کے طور پر، اگر میں بائیں طرف تصویر پیش کرتا ہوں، تو اس کے بعد کسی بھی متن یا دیگر عناصر اس کے ارد گرد بہہ گئیں. اور اگر میں دائیں طرف تصویر پیش کروں تو، اس کے پیچھے کسی بھی متن یا دوسرے عناصر کو اس کے ارد گرد بہہ جائے گا. اس تصویر پر کسی اطلاق کے بغیر متن کے کسی بلاک میں رکھی گئی ایک تصویر جس میں ظاہر ہوگی، براؤزر تصاویر کو ظاہر کرنے کے لئے مقرر کیا جاتا ہے.

عام طور پر یہ مندرجہ ذیل متن کی پہلی سطر کے ساتھ تصویر کے نچلے حصے پر ظاہر ہوتا ہے.

وہ کس طرح فلوٹ دیں گے؟

فلوٹ کیا گیا عنصر کنٹینر عنصر کے بائیں یا دائیں طرف تک جہاں تک یہ کر سکتے ہیں اس سے کہیں گے. اس کے نتیجے میں کئی مختلف حالات میں آپ کا کوڈ لکھا گیا ہے.

ان مثالوں کے لئے، میں بائیں طرف ایک چھوٹا سا ڈیوی ای عنصر طے کروں گا:

• اگر فلوٹ عنصر کے پاس پہلے سے طے شدہ چوڑائی نہیں ہے تو، قطع نظر کی ضرورت کے مطابق، اس کے طور پر زیادہ افقی جگہ کی ضرورت ہوتی ہے اور دستیاب ہو گی. نوٹ: چوڑائی کی وضاحت نہیں کی جاتی ہے جب کسی براؤزر کو فلو عناصر کے سوا عناصر کو رکھنے کی کوشش ہوتی ہے- عام طور پر غیر فلوڈ عنصر صرف ایک چھوٹا سا خلا فراہم کرتی ہے. لہذا آپ کو فلو عناصر پر ہمیشہ چوڑائی کی وضاحت کرنا چاہئے.
• اگر کنٹینر عنصر ایچ ٹی ایم ایل عنصر ہے، تو فلو شدہ ڈیوی صفحہ کے بائیں حجم پر بیٹھے گا.
• اگر کنٹینر عنصر خود کو کسی اور کی طرف سے شامل ہوتا ہے تو، فکسڈ ڈی وی کنٹینر کے بائیں حجم پر بیٹھے گی.
• آپ فلو عناصر گھوںس سکتے ہیں، اور اس کے نتیجے میں فلوٹ حیرت انگیز جگہ میں ختم ہوسکتا ہے. مثال کے طور پر، یہ فلو ایک دائیں فلو شدہ ڈیوی کے اندر ایک بائیں فلوڈ ڈیوی ہے.
• اگر کنٹینر میں کمرہ موجود ہے تو فلوٹ عناصر ایک دوسرے کے سامنے بیٹھ جائیں گے. مثال کے طور پر، اس کنٹینر میں 400px وسیع کنٹینر میں واقع تین 100px وسیع ڈیوی عناصر ہیں.

آپ تصویر گیلری، نگارخانہ ترتیب بنانے کے لئے بھی فلوٹ استعمال کرسکتے ہیں. آپ ہر تھمب نیل میں ڈالتے ہیں (یہ سب سے بہتر کام کرتا ہے جب وہ تمام سائز میں ہوں) ڈی وی میں عنوان کے ساتھ اور کنٹینر میں ڈی وی عناصر کو فلوٹ کریں.

اس بات کی کوئی بات نہیں کہ براؤزر کی ونڈو وسیع حد تک ہے، تو تمبنےل ایک ہی طرح کی لائننگ کریں گے.

فلاٹ بند کر رہا ہے

ایک بار آپ جانتے ہیں کہ ایک عنصر کو فلوٹ کیسے بنانا ہے، یہ جاننا اہم ہے کہ فلوٹ بند کرنے کا طریقہ. آپ فلوٹ سی ایس ایس واضح جائیداد کے ساتھ بند کردیں. آپ بائیں فلوٹ صاف کر سکتے ہیں، دائیں فلوٹ یا دونوں:

واضح: بائیں؛
واضح: صحیح؛
واضح: دونوں؛

جس عنصر نے آپ کو صاف جائیداد مقرر کیا ہے وہ اس عنصر سے ظاہر ہوتا ہے جو اس سمت کو طے کرتا ہے. مثال کے طور پر، اس مثال میں متن کے پہلے دو پیراگراف صاف نہیں ہیں، لیکن تیسری ہے.

مختلف ترتیب اثرات حاصل کرنے کے لئے اپنے دستاویزات کے مختلف عناصر کی واضح قدر کے ساتھ کھیلیں.

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

ایچ ٹی ایم ایل (اس پیراگراف کو دوبارہ):

دوائوں کی ایک بیماری سے بچنے والی بیماریوں میں وولٹیٹیٹ میں درد و ضبط کا باعث بنتا ہے. کام کرنے والے غیر قریبی، لیبورڈ اور ڈورا جادوگر.

سی ایس ایس (بائیں طرف تصاویر کو پھیلانے کے لئے):

img.float {فلوٹ: بائیں؛
واضح: بائیں؛
مارجن: 5px؛
}

اور دائیں طرف:

img.float {فلوٹ: دائیں؛
واضح: صحیح؛
مارجن: 5px؛
}

لے آؤٹ کے لئے فلوٹس کا استعمال کرتے ہوئے

ایک بار آپ سمجھتے ہیں کہ فلوٹ پراپرٹی کس طرح کام کرتا ہے، آپ اپنے ویب صفحات کو نکالنے کے لئے استعمال کر سکتے ہیں. یہ ایسے مرحلے ہیں جن میں میں نے ایک فکسڈ ویب صفحہ بنانا ہے.

• ترتیب (کاغذ پر یا ایک گرافکس کے آلے میں یا میرے سر میں) ڈیزائن.
• یہ بتائیں کہ صفحہ ڈویژن کہاں جا رہے ہیں.
• مختلف کنٹینرز کی چوڑائی اور ان کے اندر عناصر کا تعین کریں.
• سب کچھ فلوٹ یہاں تک کہ بیرونی سب سے زیادہ کنٹینر عنصر بائیں طرف چلتا ہے تاکہ مجھے پتہ ہے کہ یہ براؤزر کے نقطہ نظر کی بندرگاہ کے سلسلے میں ہوگا.

جب تک آپ اپنی ترتیب کے حصوں کی چوڑائی (فی صد ٹھیک ہیں) جانتے ہیں، آپ فلوٹ جائیداد کا استعمال کرسکتے ہیں تاکہ وہ ان کے صفحے پر موجود ہو. اور اچھی چیز یہ ہے کہ، آپ کو انٹرنیٹ ایکسپلورر یا فائر فاکس کے لئے مختلف باکس ہونے والے ماڈل کے بارے میں فکر کرنے کی ضرورت نہیں ہے.