एचटीएमएल टेबल का इस्तेमाल पंक्तियों और कॉलम के साथ टेबल फ़ॉर्मैट वाला डेटा दिखाने के लिए किया जाता है. <table> का इस्तेमाल करने का फ़ैसला इस आधार पर लिया जाना चाहिए कि
आप किस तरह का कॉन्टेंट प्रज़ेंट कर रहे हैं और उस कॉन्टेंट से जुड़ा आपके उपयोगकर्ताओं की ज़रूरतें क्या हैं. अगर डेटा दिखाया जा रहा है, उसकी तुलना की जा रही है, उसे क्रम से लगाया जा रहा है, उसका हिसाब लगाया जा रहा है या उसका अलग-अलग रेफ़रंस दिया जा रहा है, तो शायद <table> सही विकल्प होगा. अगर आपको बिना टेबल वाले कॉन्टेंट को अच्छी तरह से लिखना है, जैसे कि थंबनेल इमेज का एक बड़ा ग्रुप, तो टेबल सही नहीं होंगी: इसके बजाय, इमेज की एक सूची बनाएं और सीएसएस के साथ ग्रिड को स्टाइल करें.
इस सेक्शन में, हम टेबल बनाने वाले सभी एलिमेंट के बारे में बताएंगे. साथ ही, हम सुलभता और उपयोगिता से जुड़ी सुविधाओं पर भी चर्चा करेंगे. टेबल में मौजूद डेटा देते समय, आपको इन एलिमेंट का ध्यान रखना होगा. एचटीएमएल के बारे में जानें, बुनियादी तौर पर सीएसएस के बारे में नहीं है. हालांकि, सीएसएस के बारे में जानने के लिए एक पूरा कोर्स भी उपलब्ध है. हालांकि, हम टेबल के हिसाब से बनी कुछ सीएसएस प्रॉपर्टी के बारे में भी बताएंगे.
टेबल के एलिमेंट, क्रम में
<table> टैग, टेबल के कॉन्टेंट को रैप करता है. इसमें टेबल के सभी एलिमेंट शामिल होते हैं.
<table> की इंप्लिसिट ARIA की भूमिका table है. सहायक टेक्नोलॉजी को पता है कि यह एलिमेंट एक टेबल स्ट्रक्चर है. इसमें डेटा को पंक्तियों और कॉलम में व्यवस्थित किया गया है. अगर टेबल में कोई बदलाव नहीं होता है, उसमें दो डाइमेंशन वाला नेविगेशन मौजूद है या उपयोगकर्ता को सेल का क्रम फिर से बदलने की सुविधा मिलती है, तो role="grid" को सेट करें.
अगर grid की पंक्तियों को बड़ा और छोटा किया जा सकता है, तो role="treegrid" का इस्तेमाल करें.
<table> के अंदर, आपको टेबल हेडर (<thead>), टेबल के मुख्य हिस्से (<tbody>), और वैकल्पिक तौर पर टेबल फ़ुटर (<tfoot>) दिखेंगे.
इनमें से सभी टेबल की पंक्तियों (<tr>) से बने होते हैं. पंक्तियों में, टेबल हेडर (<th>) और टेबल डेटा (<td>) सेल होती हैं, जिनमें पूरा डेटा मौजूद होता है.
इनमें से किसी भी एलिमेंट से पहले, आपको DOM में दो अतिरिक्त सुविधाएं दिख सकती हैं: टेबल का कैप्शन (<caption>) और कॉलम ग्रुप (<colgroup>). <colgroup> में span एट्रिब्यूट है या नहीं, इसके आधार पर, उसमें नेस्ट किए गए टेबल कॉलम (<col>) एलिमेंट शामिल हो सकते हैं.
टेबल में मौजूद बच्चे, इस क्रम में दिखते हैं:
<caption>एलिमेंट<colgroup>एलिमेंट<thead>एलिमेंट<tbody>एलिमेंट<tfoot>एलिमेंट
हम <table> एलिमेंट के चिल्ड्रेन के बारे में बताएंगे. ये सभी ज़रूरी नहीं हैं, लेकिन इनका सुझाव दिया जाता है. इसके बाद, पंक्तियों, टेबल के हेडर वाली सेल, और टेबल डेटा सेल पर नज़र डालते हैं. <colgroup> को सबसे आखिर में कवर किया जाएगा.
टेबल कैप्शन
नेटिव और सिमैंटिक एलिमेंट होने के नाते <caption>, टेबल को नाम देने का पसंदीदा तरीका है. <caption>, प्रोग्राम के हिसाब से अपने-आप होने वाली प्रोसेस के बारे में जानकारी देने वाली टेबल का टाइटल देता है. यह डिफ़ॉल्ट रूप से सभी लोगों को दिखता है और उनके लिए उपलब्ध होता है.
<caption> एलिमेंट, <table> एलिमेंट में नेस्ट किया गया पहला एलिमेंट होना चाहिए. इसे शामिल करने से, सभी उपयोगकर्ताओं को टेबल का मकसद तुरंत पता चल जाता है. इसके लिए, उन्हें आस-पास का टेक्स्ट पढ़ने की ज़रूरत नहीं पड़ती. इसके अलावा, कैप्शन के तौर पर ऐक्सेस किया जा सकने वाला नाम देने के लिए, <table> पर aria-label या aria-labelledby का इस्तेमाल किया जा सकता है. <caption> एलिमेंट में, हर एलिमेंट के लिए खास एट्रिब्यूट नहीं हैं.
कैप्शन टेबल के बाहर दिखता है. कैप्शन की जगह को सीएसएस caption-side प्रॉपर्टी का इस्तेमाल करके सेट किया जा सकता है. यह सुविधा, अब काम नहीं करने वाले align एट्रिब्यूट के इस्तेमाल से बेहतर है. इससे कैप्शन को सबसे ऊपर और सबसे नीचे सेट किया जा सकता है. बाईं और दाईं ओर वाली पोज़िशनिंग, inline-start और inline-end के साथ अभी पूरी तरह से काम नहीं कर रही है. सबसे ऊपर, ब्राउज़र का डिफ़ॉल्ट प्रज़ेंटेशन होता है.
प्राथमिकता के मुताबिक, डेटा टेबल के हेडर और कैप्शन साफ़ होने चाहिए. साथ ही, ये टेबल इतनी आसान होनी चाहिए कि वे आसानी से खुद से समझाई जा सकें. ध्यान रखें कि
सभी उपयोगकर्ताओं के सीखने की क्षमता
एक जैसी नहीं होती. जब टेबल में "किसी चीज़ के बारे में बताना" हो या जिसे समझने की ज़रूरत हो, तो टेबल के मुख्य बिंदु या फ़ंक्शन के बारे में खास जानकारी दें. जवाब कहां लिखा जाएगा, यह इसकी लंबाई और जटिलता पर निर्भर करता है.
अगर यह छोटा है, तो उसे कैप्शन के अंदर के टेक्स्ट की तरह इस्तेमाल करें. अगर ज़्यादा लंबी हो, तो कैप्शन में इसकी खास जानकारी दें और टेबल के पहले दिए गए पैराग्राफ़ में खास जानकारी दें. साथ ही, दोनों को aria-describedby एट्रिब्यूट के साथ जोड़ें. टेबल को <figure> में रखना और जवाब को <figcaption> में रखना भी एक अच्छा विकल्प है.
डेटा सेक्शनिंग
टेबल का कॉन्टेंट तीन सेक्शन से बना होता है: शून्य या उससे ज़्यादा टेबल हेडर (<thead>) , टेबल के मुख्य हिस्से (<tbody>), और टेबल फ़ुटर (<tfoot>). ये सभी ज़रूरी नहीं होते हैं. हालांकि, हर सेक्शन शून्य या उससे ज़्यादा हो सकता है.
ये एलिमेंट, टेबल को आसानी से इस्तेमाल करने में कोई मदद नहीं करते. इसके अलावा, ये उसके इस्तेमाल में कोई रुकावट नहीं डालते. वे स्टाइलिंग हुक मुहैया कराते हैं. उदाहरण के लिए, हेडर के कॉन्टेंट को स्टिकी बनाया जा सकता है,
जबकि <tbody> के कॉन्टेंट को स्क्रोल करने के लिए बनाया जा सकता है. इन तीन एलिमेंट में से किसी एक में नेस्ट नहीं की गई लाइनें, <tbody> में साफ़ तौर पर रैप कर दी जाती हैं. इन तीनों का रोल एक ही है rowgroup.
इन तीनों में से किसी भी एलिमेंट में, एलिमेंट के लिए खास तौर पर बने एट्रिब्यूट नहीं हैं.
हमारे पास अब तक क्या है:
<table>
<caption>MLW Students</caption>
<thead></thead>
<tbody></tbody>
<tfoot></tfoot>
</table>
सुलभता की वजह से, <tfoot> एलिमेंट को मूल रूप से <thead> के बाद और <tbody> से पहले आने के लिए तय किया गया था. इसलिए, लेगसी कोडबेस में आपको सोर्स के इस क्रम का सामना करना पड़ सकता है.
टेबल का कॉन्टेंट
टेबल को टेबल हेडर, बॉडी, और फ़ुटर में बांटा जा सकता है. हालांकि, अगर टेबल में टेबल की पंक्तियां, सेल, और कॉन्टेंट नहीं हैं, तो इनमें से कोई भी काम नहीं करती. टेबल की हर पंक्ति, <tr> में एक या उससे ज़्यादा सेल होती हैं. अगर कोई सेल हेडर सेल है, तो <th> का इस्तेमाल करें.
इसके अलावा, <td> का इस्तेमाल करें.
उपयोगकर्ता-एजेंट स्टाइलशीट में, आम तौर पर <th> टेबल की हेडर सेल में मौजूद कॉन्टेंट को बीच में और बोल्ड के तौर पर दिखाया जाता है. ये डिफ़ॉल्ट स्टाइल और सभी स्टाइल, उन बंद एट्रिब्यूट के बजाय सीएसएस की मदद से बेहतर तरीके से कंट्रोल किए जाते हैं जो अलग-अलग सेल, पंक्तियों, और यहां तक कि <table> पर उपलब्ध हुआ करते थे.
सेल के बीच, सेल के अंदर, बॉर्डर, और टेक्स्ट अलाइनमेंट के लिए पैडिंग (जगह) जोड़ने वाले एट्रिब्यूट मौजूद थे. सेलपैडिंग और सेलपैडिंग को
सीएसएस border-collapse और border-spacing
प्रॉपर्टी के साथ सेट किया जाना चाहिए. सेलपैडिंग, सेल के कॉन्टेंट और उसके बॉर्डर के बीच और आस-पास की सेल के बॉर्डर के बीच स्पेस तय करती है. अगर border-collapse: collapse को सेट किया जाता है, तो Border-spacing का कोई असर नहीं होगा. अगर border-collapse: separate; सेट है, तो empty-cells: hide; की मदद से खाली सेल को पूरी तरह छिपाया जा सकता है. स्टाइलिंग टेबल के बारे में ज़्यादा जानने के लिए, टेबल से जुड़े सीएसएस स्टाइल का इंटरैक्टिव स्लाइड डेक दिया गया है.
उदाहरणों में, हमने टेबल पर एक बॉर्डर और सीएसएस वाली हर सेल को जोड़ा है, ताकि कुछ सुविधाओं को बेहतर तरीके से दिखाया जा सके:
इस उदाहरण में एक कैप्शन, टेबल हेडर, और टेबल का मुख्य हिस्सा दिया गया है. हेडर में एक पंक्ति होती है, जिसमें तीन हेडर <th> सेल होती हैं,
जिनमें तीन कॉलम होते हैं. मुख्य भाग में डेटा की तीन पंक्तियां होती हैं: पहली सेल पंक्ति के लिए हेडर सेल होती है, इसलिए हम <td> के बजाय <th> का इस्तेमाल करते हैं.
<th> सेल में सिमैंटिक मतलब होता है. इसमें columnheader या rowheader की इंप्लिसिट ARIA रोल शामिल हैं. यह scope एट्रिब्यूट की गिनती के आधार पर, सेल को कॉलम या टेबल की सेल के कॉलम या पंक्ति के हेडर के तौर पर तय करता है. अगर scope को साफ़ तौर पर सेट नहीं किया गया है, तो ब्राउज़र डिफ़ॉल्ट रूप से col या row पर सेट होगा.
हमने सिमैंटिक मार्कअप का इस्तेमाल किया है. इसलिए, 1956 सेल में दो हेडर हैं: साल और लाउ मिनिअस. इस असोसिएशन से पता चलता है कि "लाउ मिनिअस" की ग्रैजुएशन की
कामना पूरी करने का "साल" "1956" है. इस उदाहरण में, जैसा कि हम पूरी टेबल देख सकते हैं, असोसिएशन विज़ुअल तौर पर साफ़ तौर पर दिखता है.
<th> का इस्तेमाल करने से, हेडर कॉलम या पंक्ति के स्क्रोल करने के बाद भी असोसिएशन मिलता है. हम <th scope="col">Year</th> और <th scope="row">Lou Minious</th> को साफ़ तौर पर सेट कर सकते थे, लेकिन इस तरह की आसान टेबल के साथ, गिनती की गई डिफ़ॉल्ट वैल्यू काम करती हैं.
scope के लिए, rowgroup और colgroup अन्य वैल्यू हैं, जो कॉम्प्लेक्स टेबल के लिए काम की हैं.
सेल मर्ज करना
MS Excel, Google Sheets, और नंबरों की तरह ही, एक सेल में कई सेल को जोड़ा जा सकता है. यह काम एचटीएमएल की मदद से किया जाता है!
colspan एट्रिब्यूट का इस्तेमाल, एक पंक्ति में आस-पास के दो या उससे ज़्यादा सेल को मर्ज करने के लिए किया जाता है. rowspan एट्रिब्यूट का इस्तेमाल, सेल को पंक्तियों में मर्ज करने के लिए किया जाता है. इसे सबसे ऊपर वाली पंक्ति के सेल में रखा जाता है.
इस उदाहरण में, टेबल हेडर में दो पंक्तियां हैं. पहली हेडर पंक्ति में चार कॉलम में फैले तीन सेल हैं: बीच वाली सेल में colspan="2" है. ऐसा करने पर, पास वाली दो सेल मर्ज हो जाती हैं. पहली और आखिरी सेल में rowspan="2" शामिल हैं. ऐसा करने से, पास की पंक्ति के ठीक नीचे मौजूद सेल
के साथ सेल को मर्ज कर देता है.
टेबल हेडर की दूसरी पंक्ति में दो सेल हैं; ये दूसरी पंक्ति के दूसरे और तीसरे कॉलम के लिए हैं. पहले या आखिरी कॉलम के लिए किसी भी सेल का एलान नहीं किया गया है, क्योंकि पहली और आखिरी पंक्ति के पहले और आखिरी कॉलम के सेल में दो पंक्तियां होती हैं.
ऐसे मामले जहां किसी सेल को कई हेडर सेल से तय किया जाता है और ऐसे असोसिएशन को सिर्फ़ scope एट्रिब्यूट की मदद से सेट नहीं किया जा सकता, तो ऐसे मामलों में headers एट्रिब्यूट को उनसे जुड़े हेडर की स्पेस से अलग की गई सूची के साथ शामिल करें. यह उदाहरण ज़्यादा पेचीदा टेबल है, इसलिए हम scope एट्रिब्यूट की मदद से, हेडर का स्कोप साफ़ तौर पर बताते हैं. और साफ़ तौर पर बताने के लिए, हमने हर सेल में headers एट्रिब्यूट जोड़ा है.
ऐसा हो सकता है कि headers एट्रिब्यूट इस सामान्य इस्तेमाल के उदाहरण में ज़रूरी न हों. हालांकि, आपके टूलबेल्ट में इनका होना ज़रूरी है, क्योंकि आपकी टेबल जटिल हो जाती हैं. कॉम्प्लेक्स स्ट्रक्चर वाली टेबल, जैसे कि ऐसी टेबल जिनमें हेडर या सेल मर्ज किए जाते हैं या जिनमें कॉलम या लाइन के हेडर के दो से ज़्यादा लेवल होते हैं, उनमें संबंधित हेडर सेल की साफ़ तौर पर पहचान करना ज़रूरी होता है. ऐसी जटिल टेबल में, हर डेटा सेल को हेडर सेल से जोड़ें. साथ ही, उस डेटा सेल को headers एट्रिब्यूट की वैल्यू के तौर पर, स्पेस से अलग किए गए सभी हेडर की id वैल्यू की सूची के साथ जोड़ें.
headers एट्रिब्यूट आम तौर पर <td> एलिमेंट पर मिलता है, लेकिन यह <th> पर भी मान्य है.
हालांकि, टेबल स्ट्रक्चर के जटिल स्ट्रक्चर को सिर्फ़ स्क्रीन रीडर इस्तेमाल करने वालों के लिए ही नहीं, बल्कि सभी लोगों के लिए समझना मुश्किल हो सकता है. स्क्रीन रीडर की सुविधा के बारे में समझने के लिए, आसान टेबल का मतलब आसानी से समझा जाता है. टेबल में कुछ या बिना किसी स्पैन्ड सेल वाली सेल होती हैं. इन टेबल में स्कोप और हेडर जोड़ने की ज़रूरत भी नहीं होती. उन्हें मैनेज करना भी आसान होता है!
स्टाइलिंग टेबल
यहां दो ऐसे एलिमेंट हैं जिनके बारे में बहुत कम शब्दों में बताया गया है: कॉलम ग्रुप <colgroup> एलिमेंट और इसका डिसेंडेंट, खाली <col> कॉलम एलिमेंट. <colgroup> एलिमेंट का इस्तेमाल, टेबल में कॉलम के ग्रुप या <col> एलिमेंट को तय करने के लिए किया जाता है.
अगर इसका इस्तेमाल किया जाता है, तो कॉलम ग्रुपिंग को <table> में, <caption> के ठीक बाद और किसी भी टेबल डेटा से पहले नेस्ट किया जाना चाहिए.
अगर कॉलम में एक से ज़्यादा कॉलम हैं, तो span एट्रिब्यूट का इस्तेमाल करें.
आम तौर पर, किसी टेबल में कॉन्टेंट की आउटलाइन का क्रम इस तरह से होता है. इसमें <table> और <caption> ऐसे दो एलिमेंट होते हैं जिन्हें शामिल किया जाना चाहिए:
<table>
<caption>Table Caption</caption>
<colgroup>
<col/>
</colgroup>
<thead>...
<colgroup> और <col> में से किसी का भी मतलब नहीं है, क्योंकि इससे टेबल को ज़्यादा ऐक्सेस करने में मदद मिलती है. हालांकि, इनमें कॉलम की सीमित स्टाइलिंग की अनुमति दी जाती है. इसमें, सीएसएस की मदद से कॉलम की चौड़ाई सेट करना भी शामिल है.
<col> स्टाइल किसी कॉलम को तब तक स्टाइल करेंगी, जब तक कि उस स्टाइल को बदलने वाली <td> या <th> स्टाइल न हो. उदाहरण के लिए, जब
<colspan> का इस्तेमाल टेबल की कुछ पंक्तियों में सेल मर्ज करने के लिए किया जाता है, सभी को नहीं, तो आप यह पक्का नहीं कर सकते कि कौनसी पंक्ति या कॉलम की सेल के आधार पर, tr > *:nth-child(8) जैसा सिलेक्टर,
जो हर पंक्ति के आठवें चाइल्ड को चुनता है, आठवें कॉलम को पूरा हाइलाइट करेगा या कई पंक्तियों के लिए आठवें कॉलम को हाइलाइट करेगा.
माफ़ करें, सिर्फ़ कुछ ही प्रॉपर्टी इस्तेमाल की जा सकती हैं, स्टाइल को सेल में इनहेरिट नहीं किया जाता. साथ ही, टारगेटिंग सेल में <col> एलिमेंट का इस्तेमाल सिर्फ़ एक कॉम्प्लेक्स सिलेक्टर का इस्तेमाल करके किया जा सकता है, जिसमें :has() रिलेशनल सिलेक्टर भी शामिल है.
अगर <table> और <colgroup>, दोनों का बैकग्राउंड रंग है, तो <colgroup> का background-color सबसे ऊपर दिखेगा.
ड्रॉइंग का क्रम है: टेबल, कॉलम ग्रुप, कॉलम, पंक्ति ग्रुप, पंक्तियां, जिनकी सेल सबसे आखिर में और सबसे ऊपर होती हैं, जैसा कि टेबल लेयर के स्कीमा में दिखाया गया है. <td> और <th> एलिमेंट, <colgroup> या <col> एलिमेंट के डिसेंडेंट नहीं हैं और न ही उनकी स्टाइल इनहेरिट करते हैं.
टेबल को हटाने के लिए, सीएसएस स्ट्रक्चरल सिलेक्टर का इस्तेमाल किया जा सकता है. उदाहरण के लिए, tbody tr:nth-of-type(odd) {background-color: rgba(0 0 0 / 0.1);}
टेबल के मुख्य भाग में हर विषम पंक्ति में पारदर्शी काला रंग जोड़ देगा. इससे <colgroup> पर सेट किए गए सभी बैकग्राउंड इफ़ेक्ट दिखेंगे.
टेबल डिफ़ॉल्ट रूप से रिस्पॉन्सिव नहीं होती हैं. इसके बजाय, उनका साइज़ डिफ़ॉल्ट रूप से उनके कॉन्टेंट के मुताबिक होता है. कई तरह के डिवाइस पर असरदार तरीके से काम करने के लिए, टेबल लेआउट स्टाइल पाने के लिए अतिरिक्त तरीकों की ज़रूरत है. अगर टेबल एलिमेंट के लिए सीएसएस डिसप्ले प्रॉपर्टी बदली जा रही है, तो ARIA role एट्रिब्यूट को शामिल करें. हालांकि, यह काम का नहीं लग सकता, लेकिन सीएसएस display प्रॉपर्टी से कुछ ब्राउज़र में सुलभता ट्री पर असर पड़ सकता है.
डेटा प्रज़ेंट करना
टेबल एलिमेंट के सिमैंटिक मतलब होते हैं जिनका इस्तेमाल सहायक टेक्नोलॉजी करती है. इससे वे 'खोई' पाए बिना ही पंक्तियों और कॉलम में नेविगेट कर पाते हैं. प्रज़ेंटेशन के लिए <table> एलिमेंट का इस्तेमाल नहीं किया जाना चाहिए. अगर आपको सूची पर हेडिंग चाहिए, तो हेडर और सूची का इस्तेमाल करें. अगर आपको कई कॉलम में कॉन्टेंट डालना है, तो कई कॉलम वाले लेआउट का इस्तेमाल करें.
अगर आपको कॉन्टेंट को ग्रिड में दिखाना है, तो सीएसएस ग्रिड का इस्तेमाल करें. डेटा के लिए सिर्फ़ टेबल का इस्तेमाल करें. इसे इस तरह देखें: अगर आपके डेटा को मीटिंग में दिखाने के लिए स्प्रेडशीट की ज़रूरत है, तो <table> का इस्तेमाल करें.
अगर आपको प्रज़ेंटेशन सॉफ़्टवेयर में मौजूद कीनोट या Powerpoint सुविधाओं का इस्तेमाल करना है, तो आपको ब्यौरा सूची की ज़रूरत होगी.
टेबल के कॉलम को क्रम से लगाना JavaScript का काम है. हालांकि, अपने हेडर को मार्कअप करना, ताकि उपयोगकर्ताओं को पता चल सके कि कॉलम को क्रम से लगाया जा सकता है.
उपयोगकर्ताओं को बताएं कि टेबल के कॉलम, क्रम से लगाए जा सकते हैं. साथ ही, आइकॉनोग्राफ़ी को बढ़ते, घटते या क्रम से नहीं लगाया जा सकता है. फ़िलहाल, क्रम से लगाए गए कॉलम में aria-sort एट्रिब्यूट की वैल्यू के साथ क्रम से लगाने की दिशा की गिनती की गई वैल्यू शामिल होनी चाहिए.
<caption> प्यार से aria-live और ऐसे स्पैन के ज़रिए क्रम से लगाने के लिए अपडेट के बारे में बता सकता है जो डाइनैमिक तौर पर अपडेट होता है और स्क्रीन रीडर इस्तेमाल करने वालों को दिखता है. कॉलम को हेडर के कॉन्टेंट पर क्लिक करके क्रम से लगाया जा सकता है. इसलिए, हेडर का कॉन्टेंट <button> होना चाहिए.
अगर टेबल के तौर पर डेटा प्रज़ेंट नहीं किया जा रहा है, तो <table> का इस्तेमाल न करें. अगर प्रज़ेंटेशन के लिए टेबल का इस्तेमाल किया जाता है, तो role="none" सेट करें.
कई डेवलपर, फ़ॉर्म बनाने के लिए टेबल का इस्तेमाल करते हैं. हालांकि, ऐसा करने की कोई ज़रूरत नहीं होती. हालांकि, आपके लिए एचटीएमएल फ़ॉर्म के बारे में जानना ज़रूरी है, इसलिए हम इसके बारे में आगे बात करेंगे.
जांचें कि आपको कितना समझ आया
टेबल के बारे में अपनी जानकारी को परखें.
जिन सेल को हेडिंग कहते हैं उन्हें मार्क अप करने के लिए किस एलिमेंट का इस्तेमाल किया जाता है?
<header><caption><th>टेबल वाले लेआउट के लिए कौनसी जानकारी सही हो सकती है?
<dl> के लिए बेहतर है.<ul> के लिए बेहतर है.