Computer >> कंप्यूटर >  >> प्रोग्रामिंग >> CSS

CSS सीखें:कैस्केडिंग स्टाइल शीट सीखने के लिए एक गाइड

सीएसएस कैसे सीखें

क्या आपने कभी सोचा है कि आपकी पसंदीदा वेबसाइटों को कैसे डिज़ाइन किया गया था? हर वेबसाइट डिजाइन के पीछे डिजाइन का खाका होता है। एक सीएसएस कोड भी है जो एक खाका तैयार करता है।

कैस्केडिंग स्टाइल शीट्स, या सीएसएस, एक प्रोग्रामिंग भाषा है जो डेवलपर्स द्वारा वेबसाइट के सौंदर्यशास्त्र को परिभाषित करने के लिए उपयोग की जाती है। जबकि HTML भाषा आपको साइट के लिए संरचना सेट करने की अनुमति देती है, CSS आपको यह निर्धारित करने की अनुमति देता है कि साइट की विशेषताएं कैसी दिखाई देती हैं।

HTML और CSS साथ-साथ काम करते हैं। जब आप एक शीर्षक देखते हैं जो किसी वेबसाइट पर एक नए फ़ॉन्ट का उपयोग करता है, तो HTML का उपयोग शीर्षक को परिभाषित करने के लिए किया जाएगा। फिर, शीर्षक के लिए फ़ॉन्ट सेट करने के लिए CSS का उपयोग किया जाएगा। पाठ के एक पैराग्राफ पर विचार करें। टेक्स्ट को परिभाषित करने के लिए HTML का उपयोग किया जाएगा। पाठ का रंग बदलने के लिए CSS शैलियों का उपयोग किया जाएगा।

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

सीएसएस का उपयोग किस लिए किया जाता है?

CSS परिभाषित करता है कि वेब पेज पर एक तत्व कैसे दिखना चाहिए। CSS का मतलब कैस्केडिंग स्टाइल शीट है। CSS का उपयोग करके शैलियों को HTML दस्तावेज़ पर या अलग स्टाइलशीट में लागू किया जा सकता है।

CSS का उपयोग करते हुए, डेवलपर्स शैली के नियम लिखते हैं, जो एक वेबसाइट को बताते हैं कि किसी वेबसाइट पर एक निश्चित HTML तत्व कैसे दिखना चाहिए। उदाहरण के लिए, एक शैली नियम वेब पेज पर किसी छवि के लिए ऊंचाई और चौड़ाई को परिभाषित कर सकता है। कोई अन्य वेब पेज पर टेक्स्ट का आकार सेट कर सकता है।

CSS भाषा गुणों की एक विस्तृत श्रृंखला प्रदान करती है, जिनका उपयोग वेब पेज पर विभिन्न तत्वों के लिए शैलियों को लागू करने के लिए किया जाता है। ये गुण किसी तत्व के आकार, उसके रंग, उसकी सीमाओं, जहां यह वेब पेज पर दिखाई देता है, और बहुत कुछ से संबंधित हैं। यहाँ कुछ अलग नियम दिए गए हैं जिनका आप CSS में सामना कर सकते हैं:

  • फ़ॉन्ट-आकार वेब पेज पर टेक्स्ट का आकार सेट करता है।
  • रंग वेब पेज पर टेक्स्ट का रंग सेट करता है।
  • ऊंचाई वेब पेज पर किसी तत्व की ऊंचाई निर्धारित करती है।

प्रत्येक सीएसएस संपत्ति को एक मान दिया जाता है, जो ब्राउज़र को बताता है कि एक निश्चित तत्व कैसे दिखना चाहिए। उदाहरण के लिए, CSS का उपयोग ब्राउज़र को यह बताने के लिए किया जा सकता है कि सभी टेक्स्ट को नीला कर दें।

81% प्रतिभागियों ने कहा कि बूटकैंप में भाग लेने के बाद उन्हें अपनी तकनीकी नौकरी की संभावनाओं के बारे में अधिक आत्मविश्वास महसूस हुआ। आज ही एक बूटकैंप से मिलान करें।

बूटकैंप शुरू करने से लेकर अपनी पहली नौकरी खोजने तक, औसत बूटकैंप ग्रेड ने करियर संक्रमण में छह महीने से भी कम समय बिताया।

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

आपको CSS क्यों सीखना चाहिए?

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

और हमने CSS में कोड कैसे करना है सीखने के करियर के लाभों पर भी चर्चा नहीं की है। ऐसे नियोक्ताओं की कमी नहीं है जो सक्रिय रूप से ऐसे लोगों की तलाश में हैं जो CSS में कोड कर सकें।

चूंकि प्रतिभाशाली सीएसएस डेवलपर्स मांग में हैं, इसलिए वेतन भी अधिक है। इस लेखन के समय, ग्लासडोर एक वेब डिज़ाइनर के लिए औसत वेतन $52,691—एक प्रभावशाली राशि होने की रिपोर्ट करता है!

सीएसएस सीखने में कितना समय लगता है?

CSS सीखने से पहले, हम अनुशंसा करते हैं कि आप HTML का अभ्यास करने में कुछ सप्ताह व्यतीत करें। इसमें महारत हासिल करने में देर नहीं लगेगी, और आप प्रोग्रामिंग की दुनिया में एक ठोस मुकाम के साथ पहुंचेंगे। HTML आपको मूल वाक्य रचना का एहसास दिलाने में मदद कर सकता है, जो CSS सीखने के दौरान काम आएगा।

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

क्या CSS सीखना कठिन है?

CSS बुनियादी स्तर पर सीखने के लिए एक आसान प्रोग्रामिंग भाषा है। CSS तकनीक को सुलभ बनाने के लिए डिज़ाइन किया गया था ताकि कोई भी इंटरनेट पर अपने स्वयं के स्टाइल वाले वेब पेज बना सके।

जब आप HTML की मूल अवधारणाओं को सीखते हैं, तो आपको CSS में दिखाई देने वाले बहुत सारे सिंटैक्स बहुत परिचित होंगे।

उदाहरण के लिए, आप अपनी HTML फ़ाइल में किसी विशिष्ट छवि के लिए ऊंचाई और चौड़ाई जैसी कई विशेषताओं को बदल सकते हैं। हालाँकि, क्या होगा यदि आप इसे अपने पृष्ठ के सभी चित्रों पर लागू करना चाहते हैं? यहीं से सीएसएस काम आता है।

याद रखें, सीएसएस एचटीएमएल तत्वों के साथ उसी तरह से इंटरैक्ट करता है जैसे एचटीएमएल फाइल पर तत्व टैग के भीतर विशेषताएँ। हालाँकि, आप CSS में नियम कहे जाने वाले कोड के ब्लॉक के माध्यम से एक साथ कई तत्वों को स्पर्श कर सकते हैं। यदि आप HTML में अपने सभी फोंट, रंग और छवियों को स्टाइल करने में सहज हैं, तो आपको CSS के साथ काम करने में कोई समस्या नहीं होगी। इसे समझने के बाद आप इसे और भी आसान पाएंगे।

सीएसएस मुफ़्त में कैसे सीखें

अब तक, हमने CSS की पृष्ठभूमि और CSS का उपयोग करके कोड करने का तरीका जानने के लाभों पर विचार करने में समय बिताया है। लेकिन अब, हमें इस प्रश्न का उत्तर देना है:आप CSS में कोड करना कैसे सीखते हैं?

ऑनलाइन हजारों संसाधन हैं जो आपको सीएसएस में कोड करना सिखाने में मदद कर सकते हैं। यह पता लगाना मुश्किल हो सकता है कि कहां से शुरू करें। आइए कुछ मुख्य चरणों के बारे में जानते हैं जिनका पालन करके आप तेजी से CSS सीखने की अपनी यात्रा शुरू कर सकते हैं।

चरण 1:बुनियादी बातों में महारत हासिल करें

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

CSS सीखने की आपकी यात्रा में पहला कदम बुनियादी बातों पर शोध करने और अभ्यास करने में समय लगाना चाहिए। इसमें सिंटैक्स के बारे में सीखना शामिल होगा, जो सामान्य नियम हैं जिनका आपको सीएसएस कोड, चयनकर्ता, बॉक्स मॉडल और बहुत कुछ लिखते समय पालन करना चाहिए।

आरंभ करने में आपकी सहायता के लिए, यहां उन मुख्य विषयों की सूची दी गई है जिन्हें आपको जानना आवश्यक है:

CSS सिंटैक्स और चयनकर्ता

सबसे पहली बात, आपको CSS के सिंटैक्स को जानना होगा। ये बुनियादी नियम हैं जो सीएसएस प्रोग्रामिंग भाषा का उपयोग करते समय आपके द्वारा लिखी जाने वाली सभी शैलियों को नियंत्रित करते हैं। जब आप अभी शुरुआत कर रहे हैं, तो आपको यह भी सीखना होगा कि CSS नियम कहाँ और कैसे लिखें।

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

  • सीएसएस शैली नियम कैसे लिखें
  • इनलाइन, बाहरी और आंतरिक सीएसएस
  • टैग, कक्षाएं, और आईडी
  • चयनकर्ताओं की मूल बातें
  • चयनकर्ताओं और नेस्टेड तत्वों की श्रृंखला बनाना
  • एकाधिक चयनकर्ताओं का उपयोग करना
  • सीएसएस विशिष्टता

द बॉक्स मॉडल

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

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

यहां बॉक्स मॉडल के मुख्य घटक दिए गए हैं जिन्हें आपको सीखना होगा:

तत्व प्रदर्शन

HTML बाएं से दाएं और ऊपर से नीचे तक तत्वों को प्रस्तुत करता है। लेकिन, हो सकता है कि आप तत्वों को एक निश्चित तरीके से प्रदर्शित करना चाहते हों। उदाहरण के लिए, शायद आप अपने वेब पेज के निचले बाएँ कोने में एक बॉक्स दिखाना चाहते हैं।

यहीं तत्व प्रदर्शन आता है। तत्व प्रदर्शन के सिद्धांत ब्राउज़र को निर्देश देते हैं कि वेब पेज पर एक निश्चित तत्व को कहां प्रदर्शित किया जाए। इस क्षेत्र में आपको मुख्य विषयों के बारे में सीखना चाहिए:

रंग और फ़ॉन्ट

रंग और फ़ॉन्ट दो तरीके हैं जिनसे आप किसी वेबसाइट को सौंदर्य की दृष्टि से अधिक आकर्षक बना सकते हैं। कई वेबसाइट स्टाइल गाइड में उन्हें आवश्यक समझा जाता है।

CSS कई गुण प्रदान करता है जिनका उपयोग आप वेब पेज पर तत्वों के रंग को नियंत्रित करने के लिए कर सकते हैं, और टेक्स्ट कैसे दिखाई देता है। यहां कुछ ऐसे विषय दिए गए हैं जिनके बारे में आपको CSS रंगों और फोंट के बारे में सीखना चाहिए:

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

ग्रिड

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

यहां मुख्य विषय दिए गए हैं जिन्हें आप मास्टर सीएसएस ग्रिड में शामिल करना चाहेंगे:

  • सीएसएस ग्रिड संरचना
  • ग्रिड कॉलम और पंक्तियाँ
  • स्तंभ और पंक्तियाँ बनाना
  • ग्रिड अंतराल और ग्रिड लाइनें
  • ग्रिड आइटम और क्षेत्र

आप फ्लेक्सबॉक्स के बारे में सीखने में भी कुछ समय बिताना चाह सकते हैं। फ्लेक्सबॉक्स एक अन्य तकनीक है जिसका उपयोग वेब पेज पर तत्वों को रखने के लिए किया जाता है।

सीएसएस ऑनलाइन सीखने का सबसे अच्छा तरीका

अब आप जानते हैं कि सीएसएस में कोड करने के लिए आपको क्या जानने की जरूरत है, आप शायद पूछ रहे होंगे:मैं इन विषयों के बारे में कहां से सीख सकता हूं? क्योंकि CSS एक ऐसा महत्वपूर्ण उपकरण है जिसका उपयोग वेब विकास में किया जाता है, ऐसे हजारों संसाधन हैं जिनका आप उपयोग कर सकते हैं।

आपके द्वारा उपयोग किए जाने वाले संसाधन आपकी सीखने की शैली पर निर्भर करेंगे। इसलिए, इससे पहले कि आप संसाधनों की तलाश शुरू करें, अपने आप से पूछें:आप सबसे अच्छा कैसे सीखते हैं? क्या आप ट्यूटोरियल पसंद करते हैं? या क्या ऑनलाइन पाठ्यक्रम आपकी गति से अधिक हैं?

आप यह देखने के लिए कुछ अलग प्रारूपों को भी आजमा सकते हैं कि सबसे अच्छा क्या काम करता है। फिर, एक बार मिल जाने के बाद, आप अपना ध्यान उन संसाधनों पर केंद्रित कर सकते हैं जो सीखने के प्रारूप का उपयोग करते हैं जिसके साथ आप सबसे अधिक सहज हैं।

अधिकांश शुरुआती लोगों के लिए, इंटरैक्टिव ट्यूटोरियल और पाठ्यक्रम सर्वोत्तम हैं, क्योंकि वे आपको सीखते समय कुछ बनाने की अनुमति देते हैं। यह सीएसएस में विशेष रूप से महत्वपूर्ण है क्योंकि भाषा सभी दृश्यों और शैलियों के बारे में है।

ऑनलाइन CSS पाठ्यक्रम

Codecademy द्वारा CSS सीखें

  • लागत:मुफ़्त
  • दर्शक:शुरुआती

CSS सीखने के लिए 490,000 से अधिक लोगों ने इस कोर्स में दाखिला लिया है। 20 घंटे तक चलने वाले इस कोर्स में आप चयनकर्ताओं, बॉक्स मॉडल, रंग, टाइपोग्राफी आदि के बारे में जानेंगे।

खान अकादमी द्वारा HTML/CSS का परिचय

  • लागत:मुफ़्त
  • दर्शक:शुरुआती

यह निःशुल्क पाठ्यक्रम HTML और CSS का एक उत्कृष्ट परिचय है। आप वेब पेज की संरचना के बारे में सीखकर शुरुआत करेंगे। फिर, आप पेज को स्टाइल करने के लिए CSS का उपयोग करने और CSS टेक्स्ट प्रॉपर्टीज जैसे विषयों को कवर करेंगे। कोर्स के अंत में, आप पेज लेआउट और उन्नत CSS चयनकर्ताओं पर चर्चा करेंगे।

उडेसिटी द्वारा HTML और CSS का परिचय

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

ऑनलाइन CSS पुस्तकें

HTML और CSS:जॉन डकेट द्वारा डिज़ाइन और वेबसाइट बनाएं

यह पुस्तक HTML और CSS के साथ वेबसाइट बनाने का पूरा परिचय है। आप इन तकनीकों की मूल बातें सीखेंगे और वे एक साथ कैसे काम करते हैं। आपके द्वारा सीखे गए विषयों की कल्पना करने में आपकी मदद करने के लिए यह पुस्तक उदाहरणों और ग्राफिक्स की एक विस्तृत श्रृंखला के साथ आती है।

जेनिफर निडर्स्ट रॉबिंस द्वारा वेब डिज़ाइन सीखना

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

सीएसएस:एरिक मेयर और एस्टेल वेइल द्वारा परिभाषित गाइड

यह पुस्तक वही है जो यह कवर पर कहती है:यह सीएसएस के लिए एक पूर्ण मार्गदर्शिका है। कई अन्य पुस्तकों के विपरीत, यह पुस्तक पूरी तरह से CSS पर केंद्रित है। आप CSS रंग, मान, चयनकर्ता, बॉक्स लेआउट, और बहुत कुछ के बारे में जानेंगे।

ऑनलाइन CSS संसाधन

मोज़िला द्वारा CSS का उपयोग करके HTML को स्टाइल करना सीखें

Mozilla, Mozilla Web Browser के निर्माता, के पास वेबपृष्ठों में CSS जोड़ने के तरीके के बारे में एक संपूर्ण ट्यूटोरियल है। इस ऑनलाइन ट्यूटोरियल में मूल सीएसएस सिंटैक्स, सीएसएस के निर्माण खंड, टेक्स्ट को स्टाइल कैसे करें, और पेज लेआउट शामिल हैं।

कोडपेन

कोडपेन वेब विकास के लिए एक ऑनलाइन सीखने का खेल का मैदान है। यह टूल क्रिएटिव वेब डिज़ाइन के साथ प्रयोग करना आसान बनाता है। आपको शुरुआती और विशेषज्ञ डेवलपर्स द्वारा लिखी गई हजारों शैलियाँ मिलेंगी जिन्हें आप प्रेरणा के लिए देख सकते हैं।

कैरियर कर्म सीएसएस ट्यूटोरियल

Career Karma में CSS पर दर्जनों ऑनलाइन ट्यूटोरियल हैं। प्रत्येक ट्यूटोरियल कोड स्निपेट के साथ आता है जिससे आपको उन कोड स्निपेट्स के स्पष्टीकरण के साथ-साथ किसी विषय में महारत हासिल करने में मदद मिलती है। हमारी लाइब्रेरी में चयनकर्ताओं से लेकर इनलाइन शैलियों तक सब कुछ शामिल है।

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

ट्यूटोरियल के साथ CSS ऑनलाइन सीखें

वहाँ कई प्रकाशन हैं जो उत्कृष्ट सीएसएस ट्यूटोरियल देते हैं। जब आप प्रोग्रामिंग भाषाओं की अवधारणाओं को सीखते हैं तो W3Schools और Mozilla Developer Network उपयोगी होते हैं। ये संसाधन प्रत्येक अवधारणा के अभ्यास के साथ ऑनलाइन मानक ट्यूटोरियल प्रदान करते हैं।

पिछले संसाधन तब उपयुक्त होते हैं जब आप अवधारणाओं का अध्ययन करना चाहते हैं और समझना चाहते हैं कि वे कोडिंग के लिए क्यों आवश्यक हैं। एक बार जब आप उस समझ को प्राप्त कर लेते हैं, तो यह देखने का समय है कि आपने कितना सीखा है, यह देखने के लिए अपना दिमाग लगाएं। यात्रा के दौरान आपकी सहायता के लिए कई संसाधन उपलब्ध हैं, जैसे ग्रासहॉपर, सोलोलर्न और कोडेक अकादमी। उनके पास बेहतरीन एप्लिकेशन हैं जिन्हें आप अपनी पढ़ाई जारी रखते हुए डाउनलोड और उपयोग कर सकते हैं।

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

निम्नलिखित ट्यूटोरियल HTML सीखने का एक शानदार तरीका है। आप केवल इसके बारे में पढ़ने के बजाय HTML करके विकास सीखेंगे। जब फ्रंट-एंड वेब विकास की बात आती है तो व्यावहारिक रूप से सीखना महत्वपूर्ण होता है क्योंकि इसमें रचनात्मकता की डिग्री शामिल होती है।

प्रोजेक्ट बनाएं

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

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

मुझे क्या बनाना चाहिए? यह एक सामान्य प्रश्न है जिसका सामना सभी नौसिखियों द्वारा किया जाता है। सच में, कोई सही उत्तर नहीं है—आप जो चाहें बना सकते हैं!

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

क्या बनाना है, यह तय करने में आपकी सहायता के लिए, यहां कुछ उपाय दिए गए हैं:

  • एक सोशल नेटवर्किंग साइट
  • एक रेस्तरां प्रबंधन प्रणाली
  • एक प्रश्नोत्तरी खेल
  • एक ऑनलाइन शॉपिंग वेबसाइट
  • आपका वेब डिज़ाइन पोर्टफोलियो
  • एक वेब ब्लॉग
  • स्थानीय बेकरी या ग्रीनग्रोसर्स के लिए एक वेबसाइट

इस सूची को अपने विकल्पों को सीमित न करने दें। यदि आपके पास कोई अन्य विचार है, तो आगे बढ़ें और इसे बनाएं!

नई शैलियों के साथ प्रयोग करें

सीएसएस में एक्सप्लोर करने के लिए बहुत सारी सुविधाएं हैं! परिणामस्वरूप, एक बार जब आप एक वेबसाइट डिज़ाइन कर लेते हैं, तब भी बहुत से तरीके हैं जिनसे आप अपने कौशल को परिष्कृत कर सकते हैं।

अपने कौशल का अभ्यास करने का एक अच्छा तरीका विभिन्न शैलियों का उपयोग करके एक ही साइट बनाना है। यह देखने की कोशिश करें कि विभिन्न फ़ॉन्ट आकारों वाली वेबसाइट कैसी दिखती है। वेब पेज पर टेक्स्ट के कुछ पैराग्राफ के लिए अलग-अलग रंगों के प्रयोग के साथ प्रयोग करें। देखें कि जब आप किसी छवि का आकार बदलते हैं तो क्या होता है।

ये परिवर्तन आपको अच्छे डिज़ाइन की अपनी समझ को परिशोधित करने में मदद करेंगे। साथ ही, आप नई सीएसएस अवधारणाओं और गुणों के साथ प्रयोग करने में सक्षम होंगे।

CSS की सुंदरता इसकी रचनात्मकता में निहित है। एक सोशल नेटवर्किंग साइट कभी भी दूसरी जैसी नहीं दिखेगी क्योंकि ऐसे कई तरीके हैं जिनसे आप किसी साइट को कस्टमाइज़ कर सकते हैं। साइट कैसे दिखाई देती है यह वास्तव में आप पर निर्भर करता है—जब आप CSS में कोड करते हैं तो आप क्रिएटिव डायरेक्टर होते हैं!

मास्टर ब्राउज़र समर्थन

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

आपको शोध करना शुरू करना चाहिए कि आप कई ब्राउज़रों में काम करने वाली साइटें कैसे बना सकते हैं। Iसभी बेहतरीन वेबसाइट काम कर रही हैं चाहे आप किसी भी ब्राउज़र का उपयोग करें (कारण के भीतर)। किसी भी संख्या में ब्राउज़रों में अच्छी तरह से प्रदर्शित होने वाले CSS कोड को लिखने का तरीका जानना एक महान कौशल है।

ब्राउज़र समर्थन में महारत हासिल करने के लिए, निम्नलिखित संसाधन देखें:

डेवलपर समुदाय में शामिल हों

जब आप कोड करना सीख रहे होते हैं, तो आपको "अलगाव में कोड" करने का प्रलोभन दिया जा सकता है। इसका मतलब है कि आप अपना समय कोडिंग में बिताएंगे, लेकिन आप अपना काम दूसरों के साथ साझा नहीं कर सकते। यह नौसिखियों द्वारा की जाने वाली एक सामान्य गलती है।

वहाँ सैकड़ों हजारों लोग हैं जो CSS में कोड करना जानते हैं। वेब प्रोग्रामर अक्सर डेवलपर समुदायों में शामिल हो जाते हैं, जो प्रोग्रामर को शुरुआती से लेकर विशेषज्ञों तक एक साथ लाते हैं।

समुदाय नए डेवलपर से मिलने के लिए एक बेहतरीन जगह है, जिनके साथ आप चैट कर सकते हैं। वे आपको एक ऐसा स्थान देते हैं जहां आप प्रतिक्रिया प्राप्त कर सकते हैं और आवश्यकता पड़ने पर सहायता प्राप्त कर सकते हैं। यहां कुछ ऐसे समुदाय दिए गए हैं जो CSS डेवलपर्स के लिए अच्छे हैं:

  • Dev.to:सॉफ्टवेयर डेवलपर्स का एक समुदाय जो एक दूसरे की मदद करते हैं। Dev.to के पास CSS डेवलपर्स और वेब डिज़ाइन के लिए समर्पित चैनल हैं जिनका उपयोग आप CSS सीखने वाले अन्य लोगों के साथ चैट करने के लिए कर सकते हैं।
  • स्टैक ओवरफ़्लो:प्रश्न पूछने और उत्तर देने वाले डेवलपर्स का एक समुदाय।
  • GitHub:अपना कोड साझा करने और दूसरों के साथ परियोजनाओं पर सहयोग करने के लिए एक समुदाय।

ऐसे कई तरीके हैं जिनसे आप इन समुदायों में योगदान कर सकते हैं। आप किसी मौजूदा उपयोगकर्ता को उनके प्रश्न के साथ मदद कर सकते हैं, या आप अपना प्रश्न पोस्ट कर सकते हैं और चर्चा शुरू कर सकते हैं। या आप किसी ऐसे सूत्र पर टिप्पणी करके उत्तर दे सकते हैं जो आपको रुचिकर लगे। आप जो कुछ भी करते हैं वह समुदाय की बेहतर समझ बनाने में मदद करेगा!

अपने कौशल का अभ्यास करें

किसी भी प्रोग्रामिंग भाषा की तरह, CSS में कोड करना सीखना एक कौशल है। सुधार करने का सबसे अच्छा तरीका जितना हो सके उतना अभ्यास करना है। आप जितना अधिक समय CSS के बारे में सोचने में व्यतीत करेंगे, आपको उतनी ही अधिक जानकारी प्राप्त होगी।

ऐसे कई तरीके हैं जिनसे आप CSS का अभ्यास कर सकते हैं कि ऐसा न करने का कोई बहाना नहीं है। आरंभ करने में आपकी सहायता के लिए यहां कुछ उपाय दिए गए हैं:

  • कोडपेन का प्रयोग करें। कोडपेन पर अपनी पसंद की शैली ढूंढें और इसे बेहतर बनाने का प्रयास करें।
  • Codecademy पर एक चुनौती लें। Codecademy जैसी साइट पर ट्यूटोरियल का अनुसरण करें, फिर अपने स्वयं के सुधार करें।
  • समुदाय में लोगों की मदद करें। Dev.to या स्टैक ओवरफ़्लो पर एक ऐसा सूत्र खोजें जो आपको रुचिकर लगे और समुदाय के अन्य सदस्यों की मदद करने का प्रयास करें।

या, ज़ाहिर है, आप अधिक परियोजनाओं पर काम कर सकते हैं! अपने कौशल का अभ्यास करने का यह हमेशा एक शानदार तरीका है।

रैपिंग अप

CSS सीखने का आपका मार्ग उतार-चढ़ाव से भरा होगा। लंबे समय में, CSS में कोड कैसे करना है, यह जानने से आपको कई तरह के अवसर मिल सकते हैं।

CSS सीखना आपको वेब डिज़ाइनर या वेब डेवलपर बनने में मदद कर सकता है। यह बहुत अच्छा है अगर आपको लगता है कि भविष्य में आपके लिए करियर की चाल चल रही है।

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

आपके लिए सीखने के लिए CSS एक अत्यंत उपयोगी कौशल है। हालाँकि इसे शुरू करना मुश्किल हो सकता है, आप अन्य सभी डेवलपर्स की तरह इस कौशल में महारत हासिल करने में सक्षम होंगे जो CSS को जानते हैं। यह केवल कड़ी मेहनत करने और अभ्यास करने की बात है।




  1. HTML में इनलाइन CSS (स्टाइल शीट) का उपयोग कैसे करें?

    HTML में इनलाइन CSS जोड़ने के लिए, style एट्रिब्यूट का उपयोग करें। शैली विशेषता किसी तत्व के लिए एक इनलाइन शैली निर्दिष्ट करती है। विशेषता का उपयोग सीएसएस गुणों जैसे फ़ॉन्ट-परिवार, फ़ॉन्ट-शैली, पाठ-सजावट, दिशा, आदि के साथ किया जाता है। बस ध्यान रखें, शैली विशेषता का उपयोग विश्व स्तर पर किसी भी शैली

  1. एचटीएमएल डोम शैली पृष्ठभूमिमूल संपत्ति

    बैकग्राउंड-ओरिजिनल प्रॉपर्टी का इस्तेमाल बैकग्राउंड ओरिजिन यानी उसकी सापेक्ष स्थिति को सेट या पाने के लिए किया जाता है। यह चार बॉक्स मॉडल क्षेत्रों में से किसी के सापेक्ष हो सकता है। सिंटैक्स − . के लिए वाक्य रचना निम्नलिखित है बैकग्राउंडऑरिजिन प्रॉपर्टी सेट करना - object.style.backgroundOrigin =

  1. HTML और CSS के लिए शुरुआती मार्गदर्शिका

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