HTML टेबल जनरेटर

विजुअल एडिटर से HTML टेबल बनाएं और कोड तुरंत कॉपी करें।

पंक्तियांकॉलम हेडर पंक्ति बॉर्डर धारीदार पंक्तियांपैडिंग

HTML आउटपुट

<table border="1" cellpadding="8" style="border-collapse: collapse; width: 100%;">
  <thead>
    <tr>
      <th style="padding: 8px; text-align: left;">Header 1</th>
      <th style="padding: 8px; text-align: left;">Header 2</th>
      <th style="padding: 8px; text-align: left;">Header 3</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td style="padding: 8px;">Cell 1,1</td>
      <td style="padding: 8px;">Cell 1,2</td>
      <td style="padding: 8px;">Cell 1,3</td>
    </tr>
    <tr>
      <td style="padding: 8px;">Cell 2,1</td>
      <td style="padding: 8px;">Cell 2,2</td>
      <td style="padding: 8px;">Cell 2,3</td>
    </tr>
    <tr>
      <td style="padding: 8px;">Cell 3,1</td>
      <td style="padding: 8px;">Cell 3,2</td>
      <td style="padding: 8px;">Cell 3,3</td>
    </tr>
  </tbody>
</table>

इस टूल के बारे में

HTML टेबल जनरेटर आपको पंक्तियां और कॉलम सेट करने, सेल सीधे संपादित करने और तैयार HTML टेबल कोड प्राप्त करने देता है। हेडर पंक्ति, बॉर्डर, धारीदार पंक्तियां और सेल पैडिंग विजुअली कॉन्फ़िगर करें।

जेनरेटेड HTML में उचित thead और tbody संरचना के साथ सिमेंटिक मार्कअप है, जो एक्सेसिबिलिटी और स्क्रीन रीडर के लिए बेहतर है। संपादन के दौरान कोड रियल-टाइम में अपडेट होता है।

कैसे उपयोग करें

पंक्तियों और कॉलम की संख्या सेट करें।
चेकबॉक्स से हेडर पंक्ति, बॉर्डर और धारीदार पंक्तियां टॉगल करें।
सेल पैडिंग मान समायोजित करें।
सीधे सामग्री टाइप करने के लिए किसी भी सेल पर क्लिक करें।
"HTML आउटपुट" के नीचे कोड कॉपी करें और अपने प्रोजेक्ट में उपयोग करें।

उपयोग के मामले

डेटा तुलना तालिकाएं, मूल्य निर्धारण तालिकाएं, शेड्यूल, उत्पाद विशिष्टता तालिकाएं और वेब पेज पर टेबुलर फॉर्मेट में किसी भी जानकारी के लिए उपयोगी।

अक्सर पूछे जाने वाले प्रश्न

क्या CSS के बिना टेबल स्टाइल कर सकते हैं? — हां। जेनरेटेड HTML में border एट्रिब्यूट और cellpadding शामिल है, इसलिए CSS के बिना भी बेसिक स्टाइल लागू होती है।
क्या colspan या rowspan जोड़ सकते हैं? — यह टूल बेसिक टेबल संरचना बनाता है। colspan/rowspan एट्रिब्यूट जोड़ने के लिए जेनरेटेड कोड सीधे संपादित करें।
टेबल को रिस्पॉन्सिव कैसे बनाएं? — टेबल को overflow-x: auto वाले div में रखें, या छोटी स्क्रीन पर हॉरिजॉन्टल स्क्रॉलिंग के लिए CSS मीडिया क्वेरी उपयोग करें।