पंक्ती आणि स्तंभांसह संरचित स्वरूपात डेटा प्रदर्शित करण्यासाठी HTML मधील टेबल हा एक आवश्यक घटक आहे. HTML मध्ये, <table>, <tr> आणि <td> टॅग वापरून सारण्या तयार केल्या जातात.
<table> टॅग मुख्य टेबल कंटेनरचे प्रतिनिधित्व करतो, ज्यामध्ये सर्व पंक्ती आणि स्तंभ असतात. पंक्ती <tr>(टेबल रो) टॅग वापरून परिभाषित केल्या जातात, तर पंक्तीमधील सेल <td>(टेबल डेटा) टॅग वापरून परिभाषित केले जातात. याव्यतिरिक्त, तुम्ही टेबलसाठी हेडर सेल परिभाषित करण्यासाठी <th>(टेबल हेडर) टॅग वापरू शकता.
तुम्ही टेबलमधील सेल विलीन करण्यासाठी colspan आणि rowspan सारख्या विशेषता वापरू शकता किंवा एकाधिक पंक्ती आणि स्तंभांमध्ये सेल स्पॅन करू शकता. शिवाय, तुम्ही टेबलचे स्वरूप आणि लेआउट सानुकूलित करण्यासाठी CSS गुणधर्म लागू करू शकता.
टेबल( <table>)
- <table> HTML मध्ये टेबल तयार करण्यासाठी घटकाचा वापर केला जातो.
<tr>- डेटा पंक्ती() आणि स्तंभ( <td> किंवा <th>) मध्ये ठेवला आहे .
<td>- प्रत्येक डेटा सेल(डेटा सेल) किंवा <th>(हेडर सेल) घटकांमध्ये ठेवला जातो .
<table>
<tr>
<th>No.</th>
<th>Name</th>
<th>Age</th>
</tr>
<tr>
<td>1</td>
<td>John</td>
<td>25</td>
</tr>
<tr>
<td>2</td>
<td>Jane</td>
<td>30</td>
</tr>
</table>
स्तंभ शीर्षलेख( <th>)
- <th> घटकाचा वापर टेबलमध्ये स्तंभ शीर्षलेख तयार करण्यासाठी केला जातो.
- सामान्यत: टेबलच्या पहिल्या पंक्तीमध्ये ठेवले जाते.
<table>
<tr>
<th>No.</th>
<th>Name</th>
<th>Age</th>
</tr>
<!-- data rows -->
</table>
डेटा पंक्ती( <tr>):
- <tr> सारणीमध्ये डेटा पंक्ती तयार करण्यासाठी घटक वापरला जातो.
- डेटा सेल( <td>) किंवा हेडर सेल( <th>) या घटकांमध्ये ठेवल्या जातात <tr>.
<table>
<tr>
<th>No.</th>
<th>Name</th>
<th>Age</th>
</tr>
<tr>
<td>1</td>
<td>John</td>
<td>25</td>
</tr>
<tr>
<td>2</td>
<td>Jane</td>
<td>30</td>
</tr>
</table>
कॉलम स्पॅनिंग( colspan)
colspan डेटा सेल किंवा हेडर सेल टेबलमध्ये किती स्तंभांचा विस्तार करेल हे निर्धारित करण्यासाठी विशेषता वापरली जाते .
<table>
<tr>
<th colspan="2">Personal Information</th>
</tr>
<tr>
<td colspan="2">John Doe</td>
</tr>
</table>
पंक्ती पसरणे( rowspan)
rowspan डेटा सेल किंवा हेडर सेल टेबलमध्ये किती पंक्तींचा विस्तार करेल हे निर्धारित करण्यासाठी विशेषता वापरली जाते .
<table>
<tr>
<th rowspan="2">No.</th>
<td>1</td>
<td>John</td>
</tr>
<tr>
<td>2</td>
<td>Jane</td>
</tr>
</table>
सेल विलीन करणे( colspan आणि rowspan)
तुम्ही टेबलमध्ये सेल मर्ज करण्यासाठी दोन्ही colspan आणि विशेषता एकत्र करू शकता. rowspan
<table>
<tr>
<th rowspan="2">No.</th>
<th colspan="2">Personal Information</th>
</tr>
<tr>
<td>John</td>
<td>25</td>
</tr>
</table>
border मालमत्ता
- border गुणधर्म टेबलच्या बॉर्डरची जाडी निर्दिष्ट करते.
- चे मूल्य border एक गैर-ऋण पूर्णांक आहे.
<table border="1">
<!-- Table rows and columns -->
</table>
cellpadding मालमत्ता
-, cellpadding गुणमत्ता टेबलमधील सेल सामग्री आणि सेलची सीमा यांच्यातील अंतर निर्दिष्ट करते.
- चे मूल्य cellpadding एक गैर-ऋण पूर्णांक आहे
<table cellpadding="5">
<!-- Table rows and columns -->
</table>
cellspacing मालमत्ता
- cellspacing गुणधर्म टेबलमधील पेशींमधील अंतर निर्दिष्ट करते.
- चे मूल्य cellspacing एक गैर-ऋण पूर्णांक आहे.
<table cellspacing="10">
<!-- Table rows and columns -->
</table>
हे गुणधर्म आणि घटक तुम्हाला तुमच्या गरजेनुसार HTML मध्ये टेबल्स तयार आणि सानुकूलित करण्याची परवानगी देतात. तुम्ही तुमच्या वेबसाइटवर डेटा स्‍पष्‍ट आणि व्‍यवस्थित रीतीने प्रदर्शित करण्यासाठी त्यांचा वापर करू शकता.