एक वेबसाइट पर पृष्ठभूमि के रूप में दो रंगों का उपयोग कैसे करें

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

1।

बाहरी स्टाइल शीट बनाने के लिए HTML या टेक्स्ट एडिटर खोलें जो आपकी CSS बैकग्राउंड स्टाइल को होल्ड करेगा।

2।

बॉडी टैग में बैकग्राउंड के लिए एक स्टाइल परिभाषा टाइप करें। शैली की परिभाषाएं "टैग {}" का रूप लेती हैं, इसलिए बॉडी टैग की एक परिभाषा "बॉडी {}" होगी। CSS विभिन्न पैरामीटर प्रदान करता है जो आपको अपनी शैली को परिभाषित करने में सक्षम बनाता है। "पृष्ठभूमि-छवि" संपत्ति आपको अपनी पृष्ठभूमि के लिए एक छवि इंगित करने में सक्षम बनाती है। "Url" पैरामीटर में छवि के लिए एक लिंक शामिल करें। उदाहरण के लिए, कोड इस तरह दिख सकता है:

शरीर {पृष्ठभूमि-छवि: url (चित्र / 2colors.jpg); }

3।

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

शरीर {पृष्ठभूमि-छवि: url (चित्र / 2colors.jpg); पृष्ठभूमि दोहराने: दोहराने-y; }

4।

उदाहरण के लिए, ".css" एक्सटेंशन का उपयोग करके फ़ाइल सहेजें, pagestyles.css।

5।

एक वेब पेज खोलें जिसमें आप पृष्ठभूमि शैली को लागू करना चाहते हैं। बाहरी दस्तावेजों के लिंक आपके वेब पेज के "टैग सेट" के भीतर सेट किए गए हैं। "" टैग का पता लगाएँ और स्टाइल शीट तक पहुँच प्रदान करने के लिए इसके ऊपर निम्न पाठ डालें:

6।

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

लोकप्रिय पोस्ट