सीएसएस कैसे बनाएं

एक कैस्केडिंग स्टाइल शीट (सीएसएस) वेबसाइट कोडिंग के लिए एक प्रणाली है जो डिजाइनरों को समूहों को कुछ तत्वों को असाइन करके कई विशेषताओं में हेरफेर करने की अनुमति देती है. उदाहरण के लिए, वेबसाइट पृष्ठभूमि के लिए एक कोड का उपयोग करके, डिजाइनर वेबसाइट के सभी पृष्ठों पर पृष्ठभूमि रंग या छवि को सीएसएस फ़ाइल में एक परिवर्तन के साथ बदल सकते हैं. यहां एक मूल वेबसाइट के लिए सीएसएस बनाने का तरीका बताया गया है.

कदम

4 का भाग 1:
लेखन इनलाइन सीएसएस
  1. सीएसएस चरण 1 शीर्षक वाली छवि
1. सुनिश्चित करें कि आपके पास HTML टैग की बुनियादी समझ है. आपको पता होना चाहिए कि टैग कैसे काम करता है और का एसआरसी तथा हरेफ गुण.
  • सीएसएस चरण 2 शीर्षक वाली छवि
    2. कुछ जानें मूल सीएसएस गुण. आप पाएंगे कि बहुत सारे गुण हैं. हालांकि, उन सभी को सीखना जरूरी नहीं है.
  • कुछ अच्छे बुनियादी सीएसएस गुण जानने के लिए हैं रंग तथा फुहारा परिवार.
  • सीएसएस चरण 3 शीर्षक वाली छवि
    3. प्रत्येक संबंधित संपत्ति के लिए मूल्यों के बारे में जानें. सभी गुणों को एक मूल्य की आवश्यकता है. के लिए रंग संपत्ति, उदाहरण के लिए, आप डाल सकते हैं लाल मूल्य.
  • सीएसएस चरण 4 शीर्षक वाली छवि
    4. के बारे में जानें अंदाज एचटीएमएल विशेषता. इसका उपयोग किसी तत्व के भीतर किया जाता है हरेफ या एसआरसी. इसका उपयोग करने के लिए, बराबर चिह्न के बाद उद्धरण चिह्नों के भीतर, सीएसएस विशेषता, एक कोलन, और फिर संपत्ति का मूल्य डालें. इसे एक सीएसएस नियम के रूप में जाना जाता है.
  • सीएसएस चरण 5 शीर्षक वाली छवि
    5. समझें कि इनलाइन सीएसएस आमतौर पर पेशेवर वेब डेवलपर्स द्वारा वेबसाइटों के लिए उपयोग नहीं किया जाता है. इनलाइन सीएसएस एक HTML दस्तावेज़ में अनावश्यक अव्यवस्था जोड़ सकता है. हालांकि, सीएसएस कैसे काम करता है यह पेश करने का यह एक शानदार तरीका है.
  • 4 का भाग 2:
    मूल सीएसएस लिखना
    1. सीएसएस चरण 6 शीर्षक वाली छवि
    1. आपके द्वारा उपयोग की जाने वाली प्रोग्राम को लॉन्च करें. यह आपको HTML और CSS फ़ाइलों को बनाने की अनुमति देनी चाहिए.
    • यदि आपके पास एक विशेष प्रोग्राम स्थापित नहीं है, तो आप नोटपैड या किसी अन्य टेक्स्ट एडिटर का उपयोग कर सकते हैं. बस अपनी फ़ाइल को एक टेक्स्ट फ़ाइल और एक CSS फ़ाइल के रूप में सहेजें.
  • सीएसएस चरण 7 शीर्षक वाली छवि
    2. अपनी वेबसाइट के लिए HTML फ़ाइल खोलें. यदि आपके पास एक स्थापित है, तो आपको इसे एक HTML संपादक के साथ भी खोलना चाहिए.
  • एचटीएमएल संपादक आपको एक ही समय में एचटीएमएल और सीएसएस संपादित करने की अनुमति देते हैं.
  • सीएसएस चरण 8 शीर्षक वाली छवि
    3. अपने HTML सिर के भीतर एक टैग बनाएं. यह आपको एक अलग फ़ाइल की आवश्यकता के बिना सीएसएस लिखने देगा.
  • सीएसएस चरण 9 शीर्षक वाली छवि
    4. एक तत्व चुनें जिसे आप स्टाइल जोड़ना चाहते हैं और तत्व का नाम टाइप करें जिसके बाद घुंघराले ब्रेसिज़ के सेट ({ }). अपने कोड को अधिक सुगम बनाने के लिए, हमेशा दूसरी घुंघराले ब्रेस को अपनी लाइन पर रखें.
  • सीएसएस चरण 10 का शीर्षक छवि
    5. ब्रेसिज़ के बीच, अपने सीएसएस नियम टाइप करें जैसा कि आप उपयोग करेंगे अंदाज गुण. प्रत्येक पंक्ति जरूर एक अर्धविराम के साथ (-). अपने कोड को सुगम बनाने के लिए, प्रत्येक नियम अपनी लाइन पर शुरू होना चाहिए और प्रत्येक पंक्ति को इंडेंट किया जाना चाहिए.
  • यह ध्यान रखना बहुत महत्वपूर्ण है कि यह स्टाइल प्रभावित करेगा सब पृष्ठ पर चयनित प्रकार के तत्व. अगले खंड में अधिक विशिष्ट स्टाइल को कवर किया जाएगा.
  • 4 का भाग 3:
    अधिक उन्नत सीएसएस
    1. सीएसएस चरण 11 शीर्षक वाली छवि
    1. एक सीएसएस फ़ाइल बनाएं, एक HTML फ़ाइल नहीं और इसे सहेजें .सीएसएस एक्सटेंशन. अपनी HTML फ़ाइल भी खोलें.
  • सीएसएस चरण 12 शीर्षक वाली छवि
    2. एक बनाने के अपने HTML सिर में टैग करें. यह आपको एक अलग सीएसएस फ़ाइल को अपने HTML दस्तावेज़ को लिंक करने की अनुमति देगा. आपके लिंक टैग को तीन विशेषताओं की आवश्यकता है: रिलायंस, प्रकार, तथा हरेफ.
  • रिलायंस बोले तो "रिश्ता" और ब्राउज़र को यह बताता है कि रिश्ते HTML दस्तावेज़ के लिए क्या है. यहां इसका मूल्य होना चाहिए "शैली पत्रक".
  • प्रकार बताता है कि किस प्रकार का मीडिया जुड़ा हुआ है. यहां इसका मूल्य होना चाहिए "पाठ / सीएसएस"
  • हरेफ यहां इसी तरह उपयोग किया जाता है कि इसका उपयोग किसी तत्व में कैसे किया जाता है, लेकिन यहां इसे एक सीएसएस फ़ाइल से लिंक करना होगा. यदि CSS फ़ाइल HTML फ़ाइल के समान फ़ोल्डर में स्थित है, तो केवल फ़ाइल नाम को उद्धरण चिह्नों के भीतर लिखा जाना चाहिए.
  • सीएसएस चरण 13 शीर्षक वाली छवि
    3. विभिन्न प्रकार के तत्वों का चयन करें जिन्हें आप एक ही स्टाइल जोड़ना चाहते हैं. एक जोड़ें कक्षा इन तत्वों के लिए विशेषता और उन्हें अपनी पसंद के एक वर्ग के नाम के बराबर सेट करें. यह आपके तत्वों को समान स्टाइल देगा.
  • सीएसएस चरण 14 शीर्षक वाली छवि
    4. एक वर्ग को किस स्टाइल को प्राप्त करेगा. एक अवधि के साथ अपनी सीएसएस फ़ाइल में कक्षा का नाम टाइप करें (.) इससे पहले (मैं.इ. .कक्षा).
  • सीएसएस चरण 15 का शीर्षक छवि
    5. एकल तत्वों का चयन करें जिन्हें आप विशेष स्टाइल जोड़ना चाहते हैं और एक जोड़ना चाहते हैं ईद गुण. एक पाउंड प्रतीक का उपयोग कर सीएसएस में आईडी बनाई गई है (#) एक अवधि के बजाय.
  • आईडी कक्षाओं की तुलना में अधिक विशिष्ट हैं, इसलिए एक आईडी किसी भी वर्ग स्टाइल को ओवरराइड करेगी यदि उसके पास कक्षा की तुलना में एक अलग मूल्य के साथ एक विशेषता है.
  • 4 का भाग 4:
    और अधिक सीखना
    1. सीएसएस चरण 16 शीर्षक वाली छवि
    1
    W3 स्कूलों पर जाएँ. यह एक आधिकारिक वेबसाइट है जिसका उद्देश्य वेब विकास कौशल को पढ़ाना है. डब्ल्यू 3 में एचटीएमएल और सीएसएस के साथ-साथ अन्य वेब भाषाओं के लिए सूचीबद्ध बहुत सारे संदर्भ हैं.
  • सीएसएस चरण 17 शीर्षक वाली छवि
    2. विशेष रूप से एचटीएमएल और सीएसएस सीखने और शिक्षण के उद्देश्य से अन्य साइटें खोजें. जैसी साइटें सीएसएस ट्रिक्स.कॉम विशेष रूप से सीएसएस और वेब डिजाइन कौशल को पढ़ाने के उद्देश्य से हैं. प्रतिष्ठित स्रोतों को ढूंढना आपकी सीखने की यात्रा पर आपकी मदद करेगा.
  • सीएसएस चरण 18 का शीर्षक वाली छवि
    3. वेब डिजाइनरों और डेवलपर्स के संपर्क में रहें. उनका अनुभव और जान-कैसे आपको मूल्यवान ज्ञान और कौशल सिखा सकता है.
  • सीएसएस चरण 1 का शीर्षक वाली छवि
    4. उन वेबसाइटों का स्रोत कोड देखें जिन्हें आप पार करते हैं. अच्छी तरह से विकसित वेबसाइटों के सीएसएस को देखना आपको वेबसाइटों के कुछ हिस्सों को डिजाइन करने के तरीके दिखा सकते हैं. इसे नीचे कॉपी करना अभ्यास के रूप में और कोड के साथ झुकाव आपको विभिन्न सीएसएस विशेषताओं का उपयोग करने में मदद करने में मदद कर सकता है.
  • वीडियो

    इस सेवा का उपयोग करके, कुछ जानकारी YouTube के साथ साझा की जा सकती है.

    टिप्स

    कई अलग-अलग गुण हैं जिन्हें आप सीएसएस के साथ हेरफेर कर सकते हैं. अपनी पसंद की शैली के साथ एक वेबसाइट खोजें और स्रोत फ़ाइल देखें. यदि शीर्ष टैग के अंदर शीर्ष पर एक सीएसएस फ़ाइल नाम है, तो आप तत्वों को दिए गए विभिन्न गुणों और मूल्यों को देखने के लिए उस पर क्लिक कर सकते हैं.

    चेतावनी

    सीधे एचटीएमएल और सीएसएस कोडिंग कॉपी करने से आपको सीखने में मदद मिल सकती है, लेकिन आपको अपने स्वयं के डिजाइन विचारों का उपयोग करना होगा. किसी और का डिजाइन लेना चोरी और साहित्यिकता है.
    सामाजिक नेटवर्क पर साझा करें:
    समान