एक बाहरी स्टाइल शीट कैसे बनाएं

सीएसएस साइट वाइड का उपयोग करना

वेबसाइटें शैली और संरचना का संयोजन हैं, और आज के वेब पर, साइट के इन दो पहलुओं को एक-दूसरे से अलग रखने का सबसे अच्छा अभ्यास है।

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

बाहरी स्टाइल शीट के फायदे और नुकसान

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

बाहरी स्टाइल शीट के लाभ

  • आप एक ही समय में कई दस्तावेजों के स्वरूप और अनुभव को नियंत्रित कर सकते हैं।
    • यह विशेष रूप से उपयोगी होता है यदि आप अपनी वेबसाइट बनाने के लिए लोगों की एक टीम के साथ काम करते हैं। कई स्टाइल नियमों को याद रखना मुश्किल हो सकता है, और जब आपके पास मुद्रित शैली मार्गदर्शिका हो सकती है, तो यह निर्धारित करने के लिए कि यह 12 अंकों में उदाहरण टेक्स्ट लिखा जाना है या एरियल फ़ॉन्ट, या 14 पॉइंट कूरियर में यह स्पष्ट रूप से फ़्लिप करने के लिए अक्षम और कठिन है। सब कुछ एक ही स्थान पर रखते हुए, और चूंकि वह स्थान भी है जहां आप परिवर्तन करेंगे, आप रखरखाव को इतना आसान बना सकते हैं।
  • आप शैलियों की कक्षाएं बना सकते हैं जिनका उपयोग कई अलग-अलग HTML तत्वों पर किया जा सकता है।
    • यदि आप अक्सर अपने पृष्ठ पर विभिन्न चीजों पर जोर देने के लिए एक निश्चित फ़ॉन्ट स्टाइल का उपयोग करते हैं, तो आप इस स्टाइल शीट में सेट की गई क्लास एट्रिब्यूट का उपयोग कर सकते हैं ताकि यह देखने और महसूस करने के लिए, प्रत्येक उदाहरण के लिए एक विशिष्ट शैली को परिभाषित करने के बजाय जोर।
  • आप आसानी से अपनी शैलियों को अधिक कुशल बनाने के लिए समूह कर सकते हैं।
    • सीएसएस के लिए उपलब्ध सभी समूहीकरण विधियों का उपयोग बाहरी स्टाइल शीट में किया जा सकता है, और यह आपको अपने पृष्ठों पर अधिक नियंत्रण और लचीलापन प्रदान करता है।

बाहरी स्टाइल शीट के नुकसान

  • बाहरी स्टाइल शीट डाउनलोड समय बढ़ा सकते हैं, खासकर अगर वे बेहद बड़े हैं। चूंकि सीएसएस फ़ाइल एक अलग दस्तावेज़ है जिसे लोड किया जाना चाहिए, यह उस प्रदर्शन को करने के लिए प्रदर्शन को प्रभावित करेगा।
  • बाहरी स्टाइल शीट बहुत जल्दी हो जाती है क्योंकि यह कहना कठिन होता है कि शैली कब उपयोग में नहीं है क्योंकि पेज हटा दिए जाने पर इसे हटाया नहीं जाता है। आपकी सीएसएस फाइलों का उचित प्रबंधन महत्वपूर्ण है, खासकर यदि एकाधिक लोग एक ही फाइल पर काम कर रहे हैं।
  • यदि आपके पास केवल एक पृष्ठ की वेबसाइट है, तो सीएसएस के लिए बाहरी फ़ाइल होने की आवश्यकता नहीं हो सकती है क्योंकि आपके पास केवल एक पृष्ठ शैली है। बाहरी सीएसएस के कई लाभ तब खो जाते हैं जब आपके पास केवल एक पृष्ठ साइट होती है।

एक बाहरी स्टाइल शीट कैसे बनाएं

बाहरी स्टाइल शीट दस्तावेज़ स्तर स्टाइल शीट के समान वाक्यविन्यास के साथ बनाई गई हैं। हालांकि, आपको चयनकर्ता और घोषणा दोनों शामिल करने की आवश्यकता है। दस्तावेज़-स्तरीय स्टाइल शीट की तरह, नियम के लिए वाक्यविन्यास यह है:

चयनकर्ता {संपत्ति: मूल्य;}

इन नियमों को एक्सटेंशन फ़ाइल के साथ टेक्स्ट फ़ाइल में सहेजें। सीएसएस। यह आवश्यक नहीं है, लेकिन इसमें प्रवेश करने की एक अच्छी आदत है, ताकि आप निर्देशिका सूची में तुरंत अपनी स्टाइल शीट को पहचान सकें।

एक बार आपके पास स्टाइल शीट दस्तावेज़ हो जाने के बाद, आपको इसे अपने वेब पृष्ठों से लिंक करना होगा। इसे दो तरीकों से किया जा सकता है:

  1. लिंक करना
    1. स्टाइल शीट को जोड़ने के लिए, आप HTML टैग का उपयोग करते हैं। इसमें गुण, प्रकार , और href गुण हैं। रिला विशेषता बताती है कि आप क्या लिंक कर रहे हैं (इस मामले में स्टाइलशीट में), प्रकार ब्राउज़र के लिए एमआईएमई-प्रकार को परिभाषित करता है, और href .css फ़ाइल का पथ है।
  2. आयात कर रहा है
    1. आप दस्तावेज़ स्तर स्टाइल शीट के भीतर एक आयातित स्टाइल शीट का उपयोग करेंगे ताकि आप किसी भी दस्तावेज़ विशिष्ट वाले को खोने के दौरान बाहरी स्टाइल शीट के गुण आयात कर सकें। आप इसे एक लिंक किए गए स्टाइल शीट को कॉल करने के समान तरीके से कहते हैं, केवल इसे दस्तावेज़ स्तर शैली घोषणा के भीतर ही बुलाया जाना चाहिए। आप अपनी वेबसाइट को बनाए रखने की आवश्यकता के रूप में कई बाहरी स्टाइल शीट आयात कर सकते हैं।

जेनिफर क्रिनिन द्वारा मूल लेख। जेरेमी गिरार्ड द्वारा 8/8/17 को संपादित किया गया