ٽيبل جي ٽيبلز جي ذريعي HTML جدول مان سڀ کان وڏو حاصل ڪريو
HTML ٽيبل خاصيتون توهان کي HTML تي گهڻو ڪجهه ڪنٽرول ڏين ٿيون. اهڙا ڪيترائي خاصيتون جدولن تي دستياب آهن جيڪي انهن کي وڌيڪ دلچسپ ڪرڻ ۽ توهان جي صفحي جي نظر کي تبديل ڪرڻ لاء.
HTML ٽيبل عنصر جون خاصيتون
HTML5 ۾ اهو عنصر عالمي صفتون ۽ هڪ ٻي خاصيت استعمال ڪري ٿو. ۽ ان کي صرف ان جي قيمت کي تبديل ڪيو آھي يا 1 يا خالي (يعني سرحدي = ""). جيڪڏهن توهان سرحد جي چوٽي کي تبديل ڪرڻ چاهيندا آهيو، توهان کي سرحدن جي چوٿين سي ايس ملڪيت استعمال ڪرڻ گهرجي.
صحيح HTML5 ٽيلي صفائ بابت ڄاڻڻ لاء هيٺ ڏسو.
هتي پڻ ڪيترائي خاصيتون آهن جيڪي HTML 4.01 جي بيان جو حصو آهن جيڪي HTML5 ۾ ناپسند ٿي چڪا آهن:
- ٽيبل جي ٽي ڊي ۽ TH عناصر تي سي ايس ڊيڊنگنگ ملڪيت استعمال ڪريو.
- ٽيبل تي سي ايس جي ملڪيت جي سرحد واري هنڌ کي استعمال ڪريو.
- سي ڊي سي جي شئي واريون استعمال ڪريو سرحد جي رنگ: ڪارو؛ ۽ ميز تي سرحد انداز.
- سي ڊي سي جي شئي واريون استعمال ڪريو سرحد جي رنگ: ڪارو؛ ۽ ٽيبل جي مناسب عناصر تي سرحد انداز.
- ان جي نتيجي ۾، توهان کي CAPTION ۾ ٽيبل جي جوڙجڪ جي وضاحت ڪرڻ گهرجي يا پوري جدول کي نموني ۾ بيان ڪيو وڃي ۽ اها FIGCAPTION ۾ بيان ڪيو وڃي. ٻيو، توهان ٽيبل جي جوڙجڪ کي آسان بڻائي سگهو ٿا، انهي ڪري جو ڪو وضاحت ناهي.
- سي ايس ڊي جي چوٽي ملڪيت کي استعمال ڪريو.
۽ هڪ خاصيت جيڪا HTML 4.01 ۾ خراب ٿي وئي هئي ۽ پڻ HTML5 ۾ ناپسند آهي.
HTML 4.01 ٽيبل جي باري ۾ وڌيڪ ڄاڻو.
- ڦيرايو ان جي بدران ايس ايس ڊي مکيه ملڪيت استعمال ڪريو.
هتي پڻ ڪيترائي خاصيتون آهن جيڪي ڪنهن به HTML جي وضاحت جو حصو نه آهن.
انهن خاصيتن کي استعمال ڪريو جيڪڏهن توهان ڄاڻو ٿا ته اهي برائوزر جيڪي توهان جي حمايت ڪن ٿا انهن کي هٿي وٺن ۽ توهان صحيح صحيح HTML بابت پرواه نه ڪندا.
- بجاء سي ايس جي ملڪيت جا پس منظر-رنگ استعمال ڪريو.
- bordercolor بجاء ايس ايس جي ملڪيت ملڪيت سرحد رنگ استعمال ڪريو.
- bordercolorlight- بجاء ايس ايس ملڪيت ملڪيت سرحد رنگ استعمال ڪريو.
- bordercolordark ان جي بدران CSS CSS ملڪيت سرحد رنگ استعمال ڪريو.
- ڪولن جو هي خاصيت نه آهي.
- اوچائي- اس جي بدران ايس ڊي سي جي ملڪيت جي اونچائي کي استعمال ڪريو.
- بجاء ايس ايس ڊي ايس جي ملڪيت جي ڀيٽ ۾ استعمال ڪريو.
- بجاء ايس ايس ڊي ايس جي ملڪيت جي ڀيٽ ۾ استعمال ڪريو.
- ان جي بدران ايس ايم ايس ملڪيت کي صاف جاء تي استعمال ڪريو.
- ان جي بدران CSS سيٽ پراڊڪٽ کي استعمال ڪريو.
برائوزر مخصوص ٽيبل جي باري ۾ وڌيڪ سکو.
HTML5 ٽيبل عنصر جي خصوصيت
جيئن مٿي بيان ڪيو ويو آهي، صرف عالمي صفات کان، صرف هڪ خاصيت آهي، جيڪو HTML5 تي ٽيبل عنصر تي صحيح آهي: سرحد.
سرحد جي خاصيت پوري جدول جي چوڌاري سرحد ۽ ان جي اندر جا سڀ خاني بيان ڪرڻ لاء استعمال ٿينديون آهن. ڪجهه سوال هو ته ڇا اهو اهو HTML5 جي وضاحت ۾ شامل ڪيو ويندو هو، پر اهو رهي رهيو آهي ڇاڪاڻ ته اها ٽيبل جي جوڙجڪ جي باري ۾ معلومات مهيا ڪئي وئي آهي.
سرحد جي خاصيت کي شامل ڪرڻ لاء، جيڪڏهن ڪا نه آهي ته جيڪڏهن سرحد هجي يا خالي هجي يا (يا خاصيت کي ڇڏي ڇڏيندا) ته قيمت مقرر ڪريو. گهڻيون برائوزر ڪي سرحد لاء 0 جي سهائتا ڪنديون آهن، ۽ ٻي انٽيگر قدر (2، 3، 30، 500، وغيره) سرحد جي چوٽي ۾ پکسلز بيان ڪرڻ لاء، پر هي غير مستحڪم HTML5 آهي. ان جي بدران، توهان کي CSS سرحد انداز جا خاصيت استعمال ڪرڻ گهرجي ته سرحد چوٿون ۽ ٻين شالن کي بيان ڪرڻ لاء.
سرحد سان ٽيبل ٺاهڻ لاء، لکڻ:
<ٽيبل سرحد = "1" >
ھي سرحد سان ھڪ ٽيبل آھي td>
tr>
ٽيبل>اهي HTML 4.01 خاصيتون آهن جيڪي HTML5 ۾ ناپسند هوندا آهن. جيڪڏهن توهان HTML 4.01 دستاويزن لکڻ تي منصوبو ڪريو ٿا، توهان انهن کي سکڻ وارا، ٻي صورت ۾، توهان انهن کي نظر انداز ڪري سگهو ٿا. انهن جا خاصيتون متبادل آهن، مٿي بيان ڪيل.
اسان بيان ڪندڙ عنصر جو بيان ڪيو آهي جيڪي صحيح HTML5 (۽ HTML 4.01) ۾ صحيح آهن. هي بيان ڪيل ٽيليٽس جيڪي HTML 4.01 ۾ صحيح آهن، وضاحت ڪن ٿا، پر HTML5 ۾ ناگزير آهن. جيڪڏهن توهان اڃان HTML HTML01 دستاويز لکي سگهو ٿا، توهان انهن خاصيتن کي استعمال ڪري سگهو ٿا، پر انهن مان گھڻا متبادل آهن جيڪي توهان جي صفحن کي مستقبل جي مستقبل ۾ بيان ڪندا آهن جڏهن توهان HTML5 ڏانهن منتقل ڪندا آهيو.
صحيح HTML 4.01 جون خاصيتون
منسوب اسان مٿي بيان ڪيو آهي.
HTML5 مان HTML 4.01 ۾ رڳو فرق اهو آهي ته توهان چوڪين جي چوڪن ۾ پکسل کي بيان ڪرڻ لاء ڪنهن به مڪمل انٽيگر (0، 1، 2، 15، 20، 200) وغيره وضاحت ڪري سگهو ٿا.
5px سرحد سان ٽيبل ٺاهڻ لاء، لکڻ:
<ٽيبل سرحد = "5" >
ھي جدول ھڪ 5px سرحد آھي. td>
tr>
ٽيبل>سرحد سان ٻه ٽيبل جو مثال ڏسو.
منسوب سيل حدن ۽ سيل جي مواد جي وچ ۾ خلا جي مقدار کي بيان ڪري ٿو. ڊفالٽ ٻن پکسلز آهي. جيڪڏهن سيلپنگنگ 0 تائين سيٽ ڪريو جيڪڏهن توهان مواد ۽ سرحد جي وچ ۾ ڪوبه اسپون نه آهي.
20 تائين سيلڊنگ کي ختم ڪرڻ لاء، لکڻ ڪريو:
<ٽيبل cellpadding = "20" >
ھي ٽيبل 20 ۾ سيلپلڊنگ آھي. td>
tr>
سيل جون سرحدون 20 پڪنس کان الڳ ٿي وينديون. td>
tr>
ٽيبل>سيل پيڊنگنگ سان ٽيبل جو هڪ مثال ڏسو
منسوب ميز جي سيلز ۽ سيل مواد جي وچ ۾ خلا جي مقدار کي بيان ڪري ٿو. سيلپادنگ وانگر، ڊفالٽ ٻن پيڪس تي سيٽ ڪيو ويو آهي، تنهنڪري توهان کي 0 تائين مقرر ڪرڻ گهرجي جيڪڏهن توهان کي سيل اسپائننگ نه هجي.
ٽيبل تي سيل اسپائننگ کي شامل ڪرڻ لاء، لکڻ ڪريو:
<ٽيبل سيل اسپسنگ = "20" >
ھي ٽيبل ۾ 20 جي سيللي اسٽرنگنگ آھي. td>
tr>
سيلز 20 پکسلز سان الڳ ڪيا ويندا. td>
tr>
ٽيبل>سيل سان اسپرائيونگ سان ٽيبل ڏسو
منسوب جي سڃاڻپ ڪري ٿي ته سرحد جي ڀرسان سرحد جي سيڪنڊ کي نظرانداز ٿيندو. توھان پنھنجي ميز جي سڀني پاسن تي فريم ڪري سگھو ٿا، ڪنھن ھڪڙي پاسي، مٿي ۽ تري، بائیں ۽ دڙو، يا ٻيو ڪوبه.
هتي ٽيبل جي لاء HTML آهي صرف بائیں طرف سرحد:
<ٽيبل سرحد = "1" فریم = "lhs" >
ھي ٽيبل td>
ٿي ويندو آھي td>
tr>
صرف td>
کاٻي پاسي واري فريم. td>
tr>
ٽيبل>۽ ٻيو مثال ھيٺئين فريم سان.
<ٽيبل سرحد = "1" فريم = "هيٺ" >
ھي ٽيبل تي ھڪڙي فريم تي آھي. td>
tr>
ٽيبل>ڪجھ جدولن سان چڪاس ڪريو
منسوب فريم صفت سان ملندڙ آهي، رڳو اهو ميز جي خانو جي چوڌاري سرحد کي متاثر ڪري ٿو. توهان سڀني خالن تي قاعدا سيٽ ڪري سگهو ٿا، ڪالمن جي وچ ۾، گروپن جهڙوڪ TBODY ۽ TFOOT يا ٻيو.
صرف قطار جي وچ ۾ ميزائين ٺاهڻ سان ٽيبل ٺاهڻ، لکڻ:
<ٽيبل سرحد = "1" قاعدن = "قطار" >
ھي 4x4 ٽيبل آھي td>
قطار نه شاخون td>
tr>
سان ٻڌل آھي td>
قائدا وصف. td>
tr>
ٽيبل>۽ شاخن جي وچ ۾ ٻي قطار سان
<ٽيبل سرحد = "1" قاعدي = "ڪول" >
ھي آھي td>
ٽيبل td>
جتي ڪٿي td>
tr>
ڪالمنون td>
آھن td>
نمايان ٿيل td>
tr>
ٽيبل>هتي ٽيبل جي اصولن سان گڏ هڪ مثال آهي
منسوب اسڪرين جي پڙهندڙن ۽ ٻين صارف ايجنٽ لاء ميز بابت معلومات مهيا ڪري ٿو جيڪا ميزائين پڙهڻ ۾ مشڪلات هوندي. خلاصو خاصيت کي استعمال ڪرڻ لاء، توهان ٽيبل جي مختصر وضاحت لکي ۽ ان جي خاصيت جي قيمت کي ڏيو. خلاصو گھڻي معياري ويب برائوزرن ۾ ويب پيج تي نه ڏيکاريندو.
هتي اهو آهي ته هڪ خلاصا سان گڏ هڪ عام ٽيبل ڪيئن لکڻو آهي.
<ٽيبل خلا = "ھي ھڪ نمونو جدول آھي جنھن ۾ فلٽر معلومات شامل آھي. ھن ميز جو مقصد خلاصو بيان ڪرڻ آھي. >
ڪالمن 1 صف 1 td>
ڪالمن 2 قطار 1 td>
tr>
ڪالمن 1 قطار 2 td>
ڪالمن 2 قطار 2 td>
tr>
ٽيبل>ھڪڙي جدول سان گڏ ڏسو
منسوب يا توسلڪ ۾ ميز جي چوٿين يا کنٽينر جي عنصر جي طور تي بيان ڪري ٿو. جيڪڏهن چوٿين مقرر نه ڪئي وئي آهي، ميز مواد صرف گهڻو جاء تي وٺي ويندو آهي، جيئن مواد کي ڏيکڻو پوندو، وڌ ۾ وڌ چوپائي وانگر، جن کي مربع عنصر جي چوٿين.
خاص چوٿين سان ٽڪرين کي ٽيبل ٺاهڻ لاء، لکڻ:
<ٽيبل چوٽي = "300" >
ھي جدول جو ڪنٽرول جي ڊيگهه جو 80٪ آھي اھو ان ۾ آھي. td>
tr>
ٽيبل>۽ ھڪڙي جدول جي ھڪڙي جدول کي ٺاھيو جنھن جي والدين جي عنصر جو ھڪڙو حصو آھي، لکڻ:
<ٽيبل چوٽي = "80٪" >
ھي جدول جو ڪنٽرول جي ڊيگهه جو 80٪ آھي اھو ان ۾ آھي. td>
tr>
ٽيبل>چوٿين سان ميز جي ھڪڙي مثال ڏسو
خراب ٿيل HTML 4.01 ٽيبل جي خاصيت
اتي موجود آهي ٽيبل عنصر جو هڪ خاصيت آهي جيڪو HTML 4.01 ۾ خراب ٿي وئي آهي ۽ لازوال ۾ HTML5: align . اها خاصيت توهان کي سيٽ ڪرڻ جي اجازت ڏئي ٿي جتي ميزبان واري صفحي سان تعلق رکي ٿي ميز تي موجود هجي. اها منسوب HTML 4.01 ۾ خراب ٿي وئي آهي، ۽ توهان ان کي استعمال ڪرڻ کان پاسو ڪرڻ گهرجي. ان جي بدران، توهان کي CSS ملڪيت يا مارجن بائیں: آٽو استعمال ڪرڻ گهرجي. ۽ ماضي جو حق: آٽو؛ شيلتون سچل مال توهان کي اهو نتيجو ڏئي ٿو ته جيڪو صفائي سان منسوب ڪيو ويو آهي، پر اهو سڄو صفحي کي رستي تي اثر انداز ڪري ٿو. حاڪمن جو حق: آٹو؛ ۽ ماضي کان کاٻي: آٽو؛ ڇا ڇا ڪجي W3C متبادل طور تي صلاح ڏني وڃي.
هتي صفائي سان استعمال ڪندي هڪ غير مثال مثال آهي:
<ٽيبل جي شڪل = "حق" >
ھي ٽيبل صحيح سيڪنڊ آھي td>
tr>
هن جي چوگرد اڳتي هلي وهندو وڃي / td>
tr>
ٽيبل>صفار جي خاصيت استعمال ڪندي هڪ غير مثال مثال ڏسو.
۽ ساڳئي اثر صحيح (غير غير معياري) HTML سان، حاصل ڪريو:
<ٽيبل انداز = "سچل: حق؛" >
ھي ٽيبل صحيح سيڪنڊ آھي td>
tr>
هن جي چوگرد اڳتي هلي وهندو وڃي / td>
tr>
ٽيبل>هيٺ ڏنل ٽيبل خاصيتون بيان ڪري ٿي جيڪي ڪنهن به HTML جي وضاحت جو حصو نه آهن.
پوئين ڄاڻ بيان ڪري HTML جي عنصر جو خاصيتون جيڪي HTML 4.01 ۾ صحيح آهن پر HTML5 ۾ ناپسند آهن.
هيٺ ڏنل بيانن جي وضاحت ڪري ٿو جيڪو ڪنهن به موجوده بيان ۾ صحيح ناهي. جيڪڏهن توهان جو خيال ناهي ته توهان جا صفحا صحيح هوندا آهن ۽ توهان جي صارفين اهي برائوزر استعمال ڪن ٿيون جيڪي انهن عناصر جي حمايت ڪن ٿيون، پوء توهان انهن عناصر کي استعمال ڪري سگهو ٿا. پر انھن مان گھڻا آھن جديد برائوزر ۾ اڻڄاتل آھن يا متبادل آھن جيڪي وڌيڪ معيار آھن.
اسان توهان جي HTML جدولن تي اهي خاصيتون استعمال ڪرڻ جي صلاح نٿا ڪريون .
منسوب هڪ پراڻي صفت آهي جيڪو سي ايس اڳ ۾ شامل ٿي چڪو هو. اهو توهان کي ميز جي پس منظر واري رنگ کي تبديل ڪرڻ جي اجازت ڏئي ٿي. توهان رنگ جو نالو مقرر ڪري سگهو ٿا يا هڪ هيڊاڊيڪل ڪوڊ. اها خاصيت اڃا تائين ڪيترائي برائوزرن ۾ ڪم ڪري ٿو، پر مستقبل جي تصديق ٿيل HTML لاء، توهان ان کي استعمال نه ڪرڻ گهرجي، ۽ بجاء ايس ڊي استعمال ڪريو.
هن خاصيت ڏانهن بهتر متبادل انداز جي ملڪيت آهي.
ٽيبل جي پس منظر جي رنگ کي تبديل ڪرڻ لاء، لکڻ:
<ٽيبل انداز = "پس منظر رنگ: #ccc؛" >
ھي ٽيبل ھڪڙو سرمائي پس منظر آھي td>
tr>
ٽيبل>ساڳي طرح بگcolور جي خاصيت، بورڊن سرور خاصيت توهان کي خاصيت جي رنگ تبديل ڪرڻ جي اجازت ڏئي ٿي. هي منسوب صرف انٽرنيٽ ايڪسپلورر طرفان سهڪار آهي. ان جي بدران، توهان کي سرحدن جي رنگ انداز جي ملڪيت استعمال ڪرڻ گهرجي.
توهان جي ٽيبل جي سرحد جي رنگ تبديل ڪرڻ لاء، لکڻ:
<ٽيبل سرحد = "1" انداز = "سرحدن وارو رنگ: لال؛" >
ھي ٽيبل سرخ ڳاڙھو آھي. td>
tr>
ٽيبل>bordercolorlight اور bordercolordark صفات انٹرنیٹ انٹرنیٹ ایکسپلورر میں شامل تھے آپ کو آپ کی میز کے ارد گرد 3D سرحد بنانے کے لئے اجازت دینے کے. بهرحال، IE8 ۽ مٿي جي طور تي، اهو صرف IE7 معياري موڊ ۽ نرخ موڊ ۾ صرف سپورٽ آهي. Microsoft اهو ٻڌائي ٿو ته اهي خاصيتون ڪو به سهڪار نه آهن.
مختصر وقت لاء، ڪڪن خاصيت تي ٽيبل عنصر پيش ڪرڻ جي تجويز ڪئي وئي جيڪا برائوزرن کي هڪ ميز ڪيئن ٻڌايل هجي. بنيادي طور تي اهو هو ته اهو وڏين ميزين جي رفتار کي تيز ڪرڻ ۾ مدد ملندي. جيتوڻيڪ اهو صرف انٽرنيٽ ايڪسپلورر طرفان لاڳو ڪيو ويو هو، ۽ IE8 ۽ مٿي جي طور تي، اهو صرف IE7 معيار موڊ ۽ نرخ موڊ ۾ صرف سپورٽ آهي.
ڇو ته اتي هڪ چوٿون خاصيت آهي (انٽرويو ۾ HTML5) ڪيترن ئي ماڻهن کي فرض ڪيو ويو ته ٽيبل لاء اونچائي خاصيت هئي. پر ڇاڪاڻ ته جدولن جي چوٿين کي ان مواد جي مطابق يا سي ڊي يا چوٽي خاصيت ۾ بيان ڪيل چوٿين سان، اونچائي محدود نه ٿي سگهيو. ان جي بدران، برائوزر کي اونچائي خاصيت جي ميز جي گهٽ ۾ گهٽ اوچائي بيان ڪرڻ جي اجازت ڏني وئي. جيڪڏهن ٽيبل جي ڊيگهه کان گهڻو قد هئي، اهو ڊگهي ڏيکاري ها. پر توهان کي ملڪيت استعمال ڪرڻ گهرجي
سي ايس ڊي جي اونچائي مال سان توهان اونچائي کي وڌائي سگهو ٿا جيڪڏهن توهان سي ايس جي ملڪيت کي استعمال ڪندي آهي انهي سان وضاحت ڪرڻ لاء ڪنهن به اضافي مواد سان ٿئي ٿي.
ٽيبل تي گهٽ ۾ گهٽ اوچائي مقرر ڪرڻ لاء، لکڻ:
<ٽيبل انداز = "اونچائي: 30em؛" >
ھي ٽيبل گھٽ ۾ گھٽ 30 ايز اعلي آھي. td>
tr>
ٽيبل>وچ واري / کاٻي پاسي وارا ٻه صفا ۽ شامل ڪيل جڳهه (ميزبان) ۽ ميز جي مٿان / ويڪر (vspace). توھان کي بدران انداز جي ملڪيت استعمال ڪرڻ گھرجي.
20 پکسلز کي عمودي جڳھ کي سيٽ ڪرڻ ۽ 40 پکسلز تائين افقي جڳھ کي، لکڻ لاء:
<ٽيبل انداز = "مارجن: 20px 40px؛"
ھي ٽيبل 20 پکسلز جي ھڪڙي آھي ۽ 40 پکسلز جي ھڪڙي آھي. td>
tr>
ٽيبل>منسوب هڪ بوليان خاصيت آهي جنهن کي واضع ڪري ٿو ته ڇا جدول جي مواد کي والدين عنصر يا ونڊو جي ڪنڊ تي لفاف هجي يا افقي اسڪولنگ کي دٻايو وڃي. بجاء، توهان سي ڊي ملڪيت استعمال ڪندي هر ميز جي سيل جي ريپنگ خاصيتن کي وضاحت ڪرڻ گهرجي.
ھڪڙو ڪالمن سان گڏ ھڪڙي لکت کي لفافي ڪرڻ لاء، لکڻ نه ڏيو:
<ٽيبل>
انداز = "اڇو جڳهه: nowrap؛" > هيء مواد جي هڪ ٽنڊ سان آهي. پر اهو جيتوڻيڪ اهو ڪنٽرولر کان وڌيڪ آهي ته متن اڳيان ليڪ لپ نه ڪرڻ گهرجي، پر بجاء برائوزر ونڊو افقي طور تي سڀني مواد کي ڏسڻ لاء دٻايو وڃي. td>
tr>
ٽيبل>آخرڪار، وصف بيان ڪري ٿو ته هر سيل جي مواد کي عمدي اندر عمودي صفا ڦٽڻ گهرجي. ان جي بدعنوان جي بدلي، توهان هر سيل تي سي ايس جي ملڪيت استعمال ڪرڻ گهرجي جيڪي توهان جي صفائي تبديل ڪرڻ چاهيندا آهن. توهان هن طرز جي اثرات کي نوٽيس نه ڪندي جيستائين سيل جي مواد ٻين، وڏن خاني جي پيدا ڪيل موجود جاء کان گهٽ ناهي.
سيل کي دٻاء ڏيڻ لاء دٻاء کي قطار ڪرڻ (بلڪه وچ کان، ڊفالٽ جي طور تي)، لکڻ ڪريو:
<ٽيبل>
هي سيل باقي کان وڌيڪ آهي ۽ انهي جي ڊيگهه ڊگهي ٿي سگھندي آهي. تنهنڪري توهان کي ڏسو ته عمودي جڙيل سلن جي تري ۾ ترجيح ڏني وئي آهي. td>
style = "عمودي-ڦيري: ھيٺئين؛" > هيٺيون جڳھ تي. td>
وچ ۾ حدن. td>
tr>
ٽيبل>