سی ایس ایس کے ساتھ ایک ٹیبل میں اندرونی لائنز (سرحد) کیسے شامل کریں

جانیں کہ صرف پانچ منٹ میں سی ایس ایس کی میز کی سرحد کیسے بنانا ہے

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

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

سی ایس ایس ٹیبل بینڈ

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

اس آرٹیکل میں احاطہ کردہ شیلیوں کو لاگو کرنے کے لئے، آپ کو اپنے ویب صفحے پر ظاہر ہونا چاہئے. اس کے بعد آپ کو اپنے طرز کے سر میں اندرونی اسٹیٹ شیٹ کے طور پر ایک سٹائل شیٹ بنانا چاہیے (آپ کو صرف اس صورت میں اگر آپ کی "سائٹ" ایک ہی صفحہ ہے) یا دستاویز سے بیرونی سٹائل شیٹ کے طور پر منسلک کیا جائے گا اگر آپ کی سائٹ ایک سے زیادہ صفحات ہے تو کیا کریں گے - آپ کو ایک بیرونی شیٹ سے تمام صفحات کو سٹائل کرنے کی اجازت دیتی ہے). آپ شیلیوں کو اس طرز شیٹ میں داخلہ لائنوں کو شامل کرنے کے لئے ڈالیں گے.

آپ کو شروع کرنے سے پہلے

سب سے پہلے آپ کو یہ فیصلہ کرنے کی ضرورت ہے کہ آپ اپنی ٹیبل میں کہاں لائن لینا چاہتے ہیں. آپ کے پاس کئی اختیارات ہیں، بشمول:

• ایک گرڈ بنانے کے لئے تمام خلیات کے ارد گرد؛
• صرف کالموں کے درمیان لائنوں کی پوزیشننگ؛
• صرف قطاروں کے درمیان؛ یا
• مخصوص کالم یا صفوں کے درمیان.

آپ انفرادی خلیوں کے ارد گرد یا انفرادی خلیات کے اندر لائنوں کو بھی پوزیشن کرسکتے ہیں.

ٹیبل میں تمام سیلز کے ارد گرد لکیریں شامل کریں

آپ کے ٹیبل میں تمام خلیوں کے ارد گرد لائنوں کو شامل کرنے کے لئے، اس گرڈ کی طرح کے اثر کو پیدا کرنے کے لۓ، آپ کے طرز کی شیٹ میں مندرجہ ذیل شامل کریں.

td، th {
سرحد: ٹھوس 1px سیاہ؛
}

ٹیبل میں صرف کالم کے درمیان لائنز کیسے شامل کریں

کالموں کے درمیان لائنز کو جوڑنے کے لئے (اس عمودی لائنوں کو جو اوپر سے نیچے سے ٹیبل کے کالمز پر چلتا ہے) بناتا ہے، اپنی سٹائل شیٹ میں مندرجہ ذیل شامل کریں:

td، th {
سرحد بائیں: ٹھوس 1px سیاہ؛
}

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

کلاس = "کوئی سرحد">

اور پھر ہم مندرجہ ذیل طرز کو ہماری سٹائل شیٹ میں شامل کرسکتے ہیں.

نہایت سرحد {
سرحد بائیں: کوئی نہیں؛
}

ٹیبل میں بس صفوں کے درمیان لائنز کیسے شامل کریں

کالمز کے درمیان لائنیں شامل کرنے کے ساتھ ہی، آپ اپنے اسٹیٹ شیٹ میں شامل کر سکتے ہیں. مندرجہ ذیل سی ایس ایس ہماری میز کے ہر قطار کے درمیان عمودی لائنیں شامل کریں گے:

tr {
سرحد کے نیچے: ٹھوس 1px سیاہ؛
}

اور میز کے نچلے حصے سے سرحد کو دور کرنے کے لئے، آپ ایک بار دوبارہ اس ٹیگ ٹیگ میں ایک کلاس شامل کریں گے:

کلاس = "کوئی سرحد">

اپنی سٹائل شیٹ میں درج ذیل سٹائل شامل کریں:

نہایت سرحد {
سرحد کے نیچے: کوئی نہیں؛
}

کسی ٹیبل میں مخصوص کالم یا رائوں کے درمیان لائنز کیسے شامل کریں

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

کلاس = "طرف سرحد">

قطاروں کے درمیان لائنوں کو شامل کرنا بہت آسان ہے، کیونکہ آپ صرف اس قطار میں شامل کر سکتے ہیں جس پر آپ لائن چاہتے ہیں.

کلاس = "سرحد کے نیچے">

پھر سی ایس ایس اپنی سٹائل شیٹ میں شامل کریں:

.border-side {
سرحد بائیں: ٹھوس 1px سیاہ؛
}
.border-bottom {
سرحد کے نیچے: ٹھوس 1px سیاہ؛
}

ایک میز میں انفرادی سیلوں کے ارد گرد لکیریں شامل کریں

انفرادی خلیوں کے ارد گرد لائنوں کو شامل کرنے کے لئے، آپ اس خلیوں میں ایک کلاس شامل کرتے ہیں جو آپ چاہتے ہیں کہ سرحد کے چاروں طرف چاہتے ہیں:

کلاس = "سرحد">

اور پھر درج ذیل سی ایس ایس آپ کے سٹائل شیٹ میں شامل کریں:

.border {
سرحد: ٹھوس 1px سیاہ؛
}

ایک ٹیبل میں انفرادی سیلز کے اندر لائنز کیسے شامل کریں

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

---

) کے ساتھ ہے.

مفید تجاویز

اگر آپ اپنی سرحدوں میں فرقوں کو محسوس کرتے ہیں، تو آپ کو اس بات کو یقینی بنانا چاہیے کہ سرحد کے خاتمے کی طرز آپ کی میز پر مقرر ہوجائے. اپنی سٹائل شیٹ میں مندرجہ ذیل شامل کریں:

ٹیبل {
سرحد کا خاتمہ: خاتمے؛
}

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