कैसे केवल टैग और सीएसएस का उपयोग करके टेबल बनाएं

यह पोस्ट केवल “का उपयोग करके तालिका बनाने का एक पूर्ण समाधान देगी” <दिव> ” टैग और सीएसएस गुण।

टैग और CSS के माध्यम से टेबल कैसे बनाएं?

डेवलपर्स HTML में एक मुख्य 'जोड़कर एक तालिका बना सकते हैं' <दिव> 'तालिका बनाने के लिए टैग और फिर एकाधिक' <दिव> ”इसके अंदर टैग करें।

उदाहरण
तालिका बनाने के लिए निम्न HTML कोड उदाहरण पर विचार करें:

उपरोक्त कोड स्निपेट में:

• ए ' <दिव> 'टैग' नामक वर्ग के साथ जोड़ा गया है divTable ”।
• के अंदर ' डिव 'कंटेनर तत्व, एक और जोड़ें' डिव 'कक्षा के साथ कंटेनर तत्व' के रूप में घोषित किया गया शीर्ष पंक्ति ”।
• दोबारा, तीन जोड़ें ' डिव 'तत्व जिनके नाम वर्ग हैं' divRow 'तीन उप कंटेनरों के साथ' divCell ' कक्षा।
• फिर, तीन दिव्य तत्व जोड़ें 'जोड़ें' पहचान ”, “ नाम ' और ' आयु ” तालिका की शीर्ष लेख पंक्ति में।
• उसके बाद, प्रत्येक div तत्व के लिए 'आईडी', 'नाम' और 'आयु' के मान निर्दिष्ट करें।

यह 'का उपयोग करने के तरीके के बारे में था' डिव ” तालिका बनाने के लिए तत्व। अब, इसमें CSS गुण लागू करते हैं:

उपरोक्त सीएसएस शैली तत्व में:

• एक चयनकर्ता जोड़ें जो 'को संदर्भित करता है' divTable ” (जिसमें सभी तालिका मान शामिल हैं) और वांछित CSS गुणों को परिभाषित करें (अर्थात, “ दिखाना ”, “ चौड़ाई ”, “ पृष्ठभूमि का रंग ”, “ सीमा ' और ' सीमा-दूरी ”) तालिका सामग्री के लिए।
• उसके बाद, एक वर्ग चयनकर्ता जोड़ें जो 'के तत्वों का चयन करता है' divRow 'कक्षा सीएसएस जोड़ने के लिए' चौड़ाई ' और ' दिखाना 'तत्वों के गुण।
• अंत में, सीएसएस शैली के गुणों को 'तत्वों में जोड़ें' .divCell 'वर्ग चयनकर्ता।

यह आउटपुट में एक तालिका बनाएगा और निम्नलिखित परिणाम प्रदर्शित करेगा:

वह सब केवल