सीएसएस में 'डिस्प्ले: टेबल-सेल' का उपयोग कैसे और क्यों करें

यह देखा जा सकता है कि डेटा सफलतापूर्वक जोड़ा गया है:

चरण 2: शैली 'तालिका-सामग्री' कंटेनर

मुख्य div तक पहुँचने के लिए, 'का उपयोग करें' #तालिका-सामग्री ', कहाँ ' # 'एक चयनकर्ता है जिसका उपयोग निर्दिष्ट तक पहुँचने के लिए किया जाता है' पहचान 'Div कंटेनर की विशेषता। फिर, निम्नलिखित गुणों को लागू करें:

यहाँ:

• • ' दिखाना ” संपत्ति परिभाषित करती है और निर्धारित करती है कि कोई तत्व कैसा दिखता है। ऐसा करने के लिए, इस संपत्ति का मूल्य 'के रूप में सेट किया गया है मेज 'तालिका बनाने के लिए।
  • ' गद्दी 'कंटेनर के अंदर जगह आवंटित करता है।

चरण 3: स्टाइल 'tr-div' कंटेनर

अब, शैली ' tr-div 'कंटेनर इस प्रकार है:

उपरोक्त कोड ब्लॉक के अनुसार, ' दिखाना 'प्रॉपर्टी का मूल्य' के रूप में सेट किया गया है टेबल की पंक्ति 'जिसका अर्थ है कि डेटा तालिका में पंक्तियों के रूप में सेट है,' पृष्ठभूमि का रंग 'संपत्ति का उपयोग तत्व के पीछे रंग निर्दिष्ट करने के लिए किया जाता है, और अंत में,' गद्दी ' लागू की गई है:

चरण 4: 'td-div' कंटेनर पर 'डिस्प्ले: टेबल-सेल' गुण लागू करें

तीसरे डिव को 'की मदद से एक्सेस करें' .td-div 'डॉट चयनात्मक और संबंधित आईडी, और नीचे दिए गए सीएसएस गुणों को लागू करें:

• • का मूल्य दिखाना 'संपत्ति' के रूप में सेट है तालिका सेल जिसका उपयोग सेल बनाने और सेल में डेटा जोड़ने के लिए किया जाता है।
  • ' चौड़ाई ” टेबल सेल के आकार को क्षैतिज रूप से निर्दिष्ट करता है।
  • ' सीमा 'कोशिकाओं के चारों ओर एक सीमा को परिभाषित करता है।
  • ' अंतर ” संपत्ति परिभाषित सीमा के बाहर स्थान आवंटित करती है।
  • ' गद्दी 'सीमा के अंदर की जगह निर्दिष्ट करता है।

उत्पादन

CSS में “डिस्प्ले: टेबल-सेल” का उपयोग क्यों करें?

' डिस्प्ले: टेबल-सेल “सीएसएस संपत्ति का उपयोग डेटा को डिस्प्ले सेट करने के लिए किया जाता है जो तत्व को टेबल की तरह व्यवहार करता है। इसलिए, उपयोगकर्ता तालिका तत्व और td और tr सहित अन्य तत्वों का उपयोग किए बिना HTML में तालिका का डुप्लिकेट बना सकते हैं। विशेष रूप से, उसकी संपत्ति तालिका के रूप में डेटा को परिभाषित करती है।

निष्कर्ष

का उपयोग करने के लिए डिस्प्ले: टेबल-सेल 'सीएसएस संपत्ति, नेस्टेड डिव कंटेनर बनाएं और प्रत्येक कंटेनर में एक विशिष्ट नाम के साथ एक वर्ग डालें। फिर, CSS में div कंटेनर को एक्सेस करें, और “डिस्प्ले: टेबल-सेल” प्रॉपर्टी को लागू करें, जहां “ दिखाना 'संपत्ति का उपयोग तालिका कक्षों में डेटा सेट करने के लिए किया जाता है। इस पोस्ट ने डिस्प्ले: टेबल-सेल CSS प्रॉपर्टी का उपयोग करने की विधि का प्रदर्शन किया।