HTML में एक सबक सेल मर्ज करना

HTML में तालिकाएं एक बहुत सुविधाजनक तत्व हैं आप उनके साथ कुछ भी कर सकते हैं बेशक, मुख्य उद्देश्य - एक तालिका के रूप में जानकारी की नियुक्ति। लेकिन साइट डेवलपर्स आगे चला गया। एक बार यह एक साइट कंकाल बनाने के लिए तालिकाओं का उपयोग करने के लिए बहुत लोकप्रिय था। अब पेशेवर ऐसा करने की कोशिश नहीं कर रहे हैं।

बड़ी संख्या में विशेषताओं के कारण तालिकाओं का व्यापक रूप से उपयोग किया जाता है उदाहरण के लिए, पंक्तियों या स्तंभों को संयोजित करने के लिए यह बहुत उपयोगी था।

सिद्धांत का परिचय

एचटीएमएल में, कोशिकाओं का संघ दो विशेषताओं का उपयोग करता है: colspan और rowspan वे टीडी टैग के लिए निर्दिष्ट हैं।

हम विषय में जाने से पहले किसी तालिका की संरचना का परीक्षण करके शुरू करते हैं। किसी भी तालिका में एक रेखा है, और इसमें कोशिकाएं हैं याद रखें कि शुरू में सभी तालिकाओं में एक ही नंबर की कोशिकाएं होनी चाहिए।

ऊपर दिए गए आंकड़े दो पंक्तियां दिखाते हैं, और प्रत्येक में तीन कोशिकाएं होती हैं यह एक सामान्य तालिका है यदि आप किसी भी पंक्ति में एक छोटी सी कोशिकाओं को निर्दिष्ट करते हैं, तो तालिका "जाने" होगी, सब कुछ गलत तरीके से प्रदर्शित होगा।

HTML तालिका: संयोजन कोशिकाओं को खड़ी और क्षैतिज रूप से

आप कम कोशिकाओं या पंक्तियों को केवल तभी निर्दिष्ट कर सकते हैं जब आप कुछ जोड़ते हैं। लेकिन शुरुआत के निकटतम पड़ोसी में हटाए गए तत्व की बजाय, आपको एक अतिरिक्त विशेषता निर्दिष्ट करने की आवश्यकता है। यदि आप कॉलम को जोड़ते हैं, तो कॉलस्पेन, यदि पंक्तियाँ, फिर रोशनी विशेषता का मान विलय करने वाले तत्वों की संख्या को इंगित करता है।

ध्यान दें कि आपको बिल्कुल निकटतम तत्वों को शुरुआत में निर्दिष्ट करने की आवश्यकता है। उदाहरण के लिए, ऊपर दिए गए आंकड़े में, यदि आप सेल 1 और 2 को मर्ज करना चाहते हैं, तो आपको सेल 1 में एक कॉलस्पान विशेषता दो में से एक मान के साथ निर्दिष्ट करना होगा। और सेल नंबर 2 या 3 को हटाने के लिए अब महत्वपूर्ण नहीं है।

निचली रेखा यह है कि आप सेल को बताएंगे कि यह कितना स्थान लेगा। डिफ़ॉल्ट मान 1 है

एचटीएमएल टेबल पर खड़ी कक्षों में शामिल होना समान है बस कब्जा अंतरिक्ष खड़ी माना जाएगा। नीचे चित्र देखें।

यहां 43 नंबर के साथ सेल दो लाइनों पर है। ऐसा करने के लिए, आपने रोशनी विशेषता निर्दिष्ट की है। इसे केवल याद किया जाता है:

• पंक्ति एक स्ट्रिंग है
• कर्नल स्तंभ / स्तंभ
• अवधि - संघ

भाषा के रचनाकारों ने मानव को जितना संभव हो उतना करीब लाने की कोशिश की, ताकि, यहां तक कि यह जानने के बावजूद, कोई भी कम से कम किसी तरह समझ सके।

एचटीएमएल में, कोशिकाओं का संघ एक साथ दो दिशाओं में किया जा सकता है: खड़ी और क्षैतिज रूप से। ऐसा करने के लिए, एक साथ दोनों विशेषताओं को निर्दिष्ट करें

ऊपर की आकृति में, यह केवल संकेत दिया जाता है, कि आप शामिल हो सकते हैं: पंक्तियां, स्तंभ, और एक ही समय में स्तंभ और पंक्तियाँ

HTML: कक्षों को मिलाएं उदाहरण

बड़े तालिकाओं में अधिक जटिल, चरण-दर-चरण उदाहरणों पर विचार करें बाईं ओर की आकृति में नीचे नियमित तालिका का मूल संस्करण है। और दूसरी तरफ दो कोशिकाओं के विलय के साथ दाहिनी ओर एक प्रकार है। HTML कोड की तुलना करना आसान है

आप केंद्र में तीन कोशिकाओं को भी जोड़ सकते हैं। पहले मामले में, colspan विशेषता सेल # 1 में निर्दिष्ट किया गया था यहां पहला परिवर्तन अपरिवर्तित होगा, और दूसरा तीन के बराबर एक colspan जोड़ा जाएगा।

यदि आप एक पंक्ति में सभी कक्षों को एक साथ जोड़ना चाहते हैं, तो चार टीडी हटाएं और पहले निर्दिष्ट colspan = '5' में

जैसा कि आप देख सकते हैं, वास्तव में, यह सब सरल है इसमें कुछ भी जटिल नहीं है मुख्य बात, ध्यान से, पहली बार, तालिकाओं के सभी नुकसान को समझने के लिए, और तब कोई समस्या नहीं होनी चाहिए।

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

एचटीएमएल में, कोशिकाओं का संघ हमेशा सामान्य टेबल के लिए जानकारी (वर्ड या एक्सेल में) के साथ उपयोग नहीं होता है वेबसाइट डेवलपर्स अक्सर, लेकिन वे वेबसाइट लेआउट के लिए उनका इस्तेमाल करते थे।

उदाहरण के लिए, आप इस साइट लेआउट पर विचार कर सकते हैं। यह डिजाइन बहुत सरल और आदिम है। लेकिन यहां आप एसोसिएशन के उपयोग को स्पष्ट रूप से दिखा सकते हैं।

यहां शुरू में तीन पंक्तियों की एक तालिका थी, दो कोशिकाएं प्रत्येक थीं। फिर, साइट के लोगो को रखने के लिए, पहली पंक्ति में दो कक्षों को मिला दिया गया था। नीचे की रेखा ने "तहखाने" को जगह के समान किया

इसके लिए धन्यवाद, आप अपने स्थान पर डिजाइन तत्व रख सकते हैं, और कुछ भी नहीं अपनी सीमाओं से कहीं ज्यादा आगे बढ़ सकते हैं। यह बहुत सुविधाजनक और सरल है यही कारण है कि यह इतना लोकप्रिय था। अब यह एक div टैग ब्लॉक बनाने के लिए सिफारिश की है

निष्कर्ष

और याद रखें कि HTML तालिका में, आप अपनी पसंद के रूप में कोशिकाओं को जोड़ सकते हैं। यह सब आपकी क्या जरूरत पर निर्भर करता है, और आप इसे कैसे करना चाहते हैं मुख्य बात, भ्रमित मत हो। यदि आप बड़ी संख्या में शामिल होने के साथ एक बड़ी तालिका बनाना चाहते हैं, तो यह सिफारिश की जाती है कि आप इसे पहले कागज़ के किसी टुकड़े पर या पेंट में खींच लें। यह शुरुआती लोगों के लिए आसान होगा

जब आप अनुभव प्राप्त करते हैं, तो आप आसानी से अपने सिर में ऐसे संचालन कर सकते हैं।