तालिका को ब्राउज़र विंडो के संपूर्ण स्थान तक फैलाने की आवश्यकता उत्पन्न होती है, उदाहरण के लिए, जब पृष्ठ डिज़ाइन को तालिका के अंदर रखा जाता है। इस समस्या के समाधान के लिए जटिल कोड लिखने की आवश्यकता नहीं है, लेकिन इसमें वेब पेजों के मार्कअप की कुछ विशेषताओं को ध्यान में रखना शामिल है।
ज़रूरी
एचटीएमएल का बुनियादी ज्ञान
निर्देश
चरण 1
सबसे पहले, आपको आगामी ऑपरेशन के अर्थ को स्पष्ट करने की आवश्यकता है। HTML कोड में, टेबल पेज नेस्टेड पेयर टैग्स (एक ओपनिंग और एक क्लोजिंग) का एक सेट होता है। सेल टैग (
) स्ट्रिंग टैग के भीतर नेस्टेड हैं (
), और वे, बदले में, तालिका टैग में (
) तालिका के उद्घाटन टैग में, आप इसकी चौड़ाई और ऊंचाई को पूर्ण इकाइयों (पिक्सेल) और सापेक्ष (प्रतिशत) दोनों में सेट कर सकते हैं। सापेक्ष आकार के साथ, तालिका के मूल तत्व की चौड़ाई और ऊंचाई को 100% के रूप में लिया जाता है। यदि आप तालिका को सीधे पृष्ठ के मुख्य भाग में रखते हैं (और किसी परत, रूप, अन्य तालिका आदि में नहीं), तो उसके मूल तत्व के आयाम पृष्ठ की चौड़ाई और ऊँचाई होंगे। इसका मतलब है कि तालिका को सभी खाली स्थान पर फैलाने के लिए, आपको इसके लिए 100% क्षैतिज और ऊर्ध्वाधर आयाम निर्दिष्ट करने की आवश्यकता है।
चरण 2
अब आप इसे HTML में व्यवहार में लाना शुरू कर सकते हैं। तालिका की चौड़ाई और ऊंचाई चौड़ाई और ऊंचाई विशेषताओं द्वारा निर्दिष्ट की जाती है। तो तालिका कोड सभी दिशाओं में 100% आयामों को दर्शाता है और, उदाहरण के लिए, एक पंक्ति में दो कोशिकाओं के साथ, ऐसा दिख सकता है:
| तालिका का बायां कक्ष | टेबल का दायां सेल |
चरण 3
यदि आप सही HTML मानक चुनते हैं जिसके द्वारा ब्राउज़र को पृष्ठ कोड पढ़ना चाहिए, तो 100% चौड़ाई और ऊंचाई निर्दिष्ट करना तालिका को फैलाने के लिए पर्याप्त होगा। टैग को दस्तावेज़ की पहली पंक्ति पर रखा गया है। आपको निम्न सामग्री वाले टैग की आवश्यकता है:
चरण 4
और आपके कोड में एक और बिंदु को ध्यान में रखा जाना चाहिए: डिफ़ॉल्ट रूप से, पृष्ठ विंडो के किनारों से कुछ पिक्सेल द्वारा इंडेंट किया जाता है, इसलिए तालिका, पूरे पृष्ठ को भरने के बाद भी, पूरी विंडो तक नहीं खिंचेगी। इन अनावश्यक क्षेत्रों को खत्म करने के लिए, आप पेज बॉडी () के शुरुआती टैग में संबंधित विशेषताओं में शून्य इंडेंट निर्दिष्ट कर सकते हैं:
चरण 5
जब असेंबल किया जाता है, तो स्क्रीन की पूरी चौड़ाई और ऊंचाई तक फैली हुई टेबल वाला पूरा पेज कोड इस तरह दिखेगा:
तनी हुई मेज
| तालिका का बायां कक्ष | टेबल का दायां सेल |
