ٹیبل ہیڈر گروپ کیا ہے؟
سی ایس ایس میں، ' ٹیبل ہیڈر گروپ ٹیبل کے ہیڈر کو ظاہر کرنے کے لیے استعمال کیا جاتا ہے 'ٹیگ۔ ہیڈر عمودی کالم میں پہلی اندراج سے مطابقت رکھتا ہے۔ یہ ٹیبل کے اندراجات کے بارے میں معلومات کی وضاحت کرتا ہے۔ اگر ضرورت ہو تو ہیڈر متعدد کالموں کو بھی پھیلا سکتا ہے۔ یہ سی ایس ایس میں ٹیبل کالم گروپ بنا کر کیا جا سکتا ہے۔
مثال مندرجہ ذیل اقدامات وضاحت کرتے ہیں کہ ٹیبل ہیڈر کیسے بنایا جائے: آؤٹ پٹ ' ٹیبل فوٹر گروپ 'کی مدد سے CSS میں ٹیبل کے فوٹر کو ظاہر کرنے کے لئے استعمال کیا جاتا ہے' 'ٹیگ۔ فوٹر ٹیبل کے مواد کے بارے میں بھی معلومات دیتا ہے جو پڑھنے والے کو ڈیٹا کو زیادہ واضح طور پر سمجھنے میں مدد فراہم کر سکتا ہے۔ پچھلے حصے کی اسی مثال کو استعمال کرتے ہوئے، فوٹر شامل کریں جو ٹیبل میں 'مرد' اور 'خواتین' کے لیے ہر کالم میں اندراجات کی کل تعداد دیتا ہے۔ مثال درج ذیل اقدامات ٹیبل فوٹر بنانے کے اقدامات کی وضاحت کرتے ہیں۔ آؤٹ پٹ سی ایس ایس میں ٹیبل میں ہیڈر اور فوٹر بالترتیب ٹیبل کے اوپر اور نیچے مزید معلومات شامل کرنے میں مدد کرتے ہیں۔ یہ معلومات اس بات کا تعین کرنے میں مدد کرتی ہے کہ ٹیبل کس چیز کے بارے میں ہے اور ٹیبل میں داخل کی گئی اقدار کے اندر مزید تفصیل فراہم کرتا ہے۔ یہ دونوں مل کر ٹیبل کے اندر موجود ڈیٹا کو مکمل طور پر فریم کرتے ہیں۔
ٹیبل کے ہیڈر میں ٹیبل کے باقی اندراجات سے مختلف فارمیٹنگ ہوتی ہے تاکہ اسے بصری طور پر الگ کیا جا سکے۔ یہ عام طور پر بولڈ فونٹ سائز یا اوپری پیمانے کے متن سے ظاہر ہوتے ہیں۔ 'مرد' اور 'خواتین' کے ناموں کی فہرست بناتے وقت، ہم انہیں الگ قطار میں بطور ہیڈرز تفویض کر سکتے ہیں جیسا کہ ذیل کی مثال میں دکھایا گیا ہے:
< ٹیبل >
< تھیڈ >
< tr >
< ویں > مرد < / ویں >
< ویں > خواتین < / ویں >
< / tr >
< / تھیڈ >
< tbody >
< tr >
< td > جیمز < / td >
< td > جیسیکا < / td >
< / tr >
< tr >
< td > ڈیوڈ < / td >
< td > لورا < / td >
< / tr >
< tr >
< td > جیکب < / td >
< td > ربیکا < / td >
< / tr >
< / tbody >
< / ٹیبل >
' ٹیگ کے ذریعے قطار کے طور پر شامل کریں اور ہیڈر کو ' ' ٹیگ کا استعمال کرتے ہوئے ہر قطار کے لیے ڈیٹا داخل کریں۔
ٹیبل فوٹر گروپ کیا ہے؟
زیر بحث تصور کی وضاحت کرنے والی مندرجہ ذیل مثال کا جائزہ:
< تھیڈ >
< tr >
< ویں >مرد< / ویں >
< ویں >خواتین< / ویں >
< / tr >
< / تھیڈ >
< tbody >
< tr >
< td جیمز < / td >
< td جیسکا< / td >
< / tr >
< tr >
< td ڈیوڈ< / td >
< td > لورا< / td >
< / tr >
< tr >
< td جیکب < / td >
< td ریبیکا< / td >
< / tr >
< / tbody >
< tfoot >
< tr >
< td کلاس = 'bg-gray-200' کل 03< / td >
< td کلاس = 'bg-gray-200' کل 03< / td >
< / tr >
< / tfoot >
< / ٹیبل >
اوپر لکھا ہوا کوڈ درج ذیل نتیجہ پیدا کرتا ہے:
نتیجہ