Types Of CSS In Hindi : सीएसएस के विभिन्न प्रकार
आजकल सभी दुनिया के लोग इंटरनेट का उपयोग करते हुए सोशल मीडिया पर अपने विचारों और उत्पादों को प्रसारित करना चाहते हैं। इसलिए, उन्हें एक वेबसाइट बनाने की जरूरत होती है जो उनके उत्पादों और सेवाओं को ऑनलाइन प्रदर्शित करती है।
वेबसाइट के उपयोगकर्ता अपनी पसंद के अनुसार वेबसाइट का डिजाइन चुनते हैं। इसमें सीएसएस का उपयोग करके वेबसाइट का डिजाइन अधिक आकर्षक बनाया जाता है। इस लेख में, हम “Types Of CSS In Hindi” के विभिन्न प्रकार के बारे में विस्तार से जानेंगे।
CSS यानी Cascading Style Sheets एक वेब डिजाइनिंग लैंग्वेज है जो वेबपेज को बेहतर ढंग से डिजाइन करने में मदद करता है। CSS के विभिन्न प्रकार होते हैं जो वेबपेज में अलग-अलग तरीके से इस्तेमाल किए जाते हैं। यहां हम सीएसएस के विभिन्न प्रकारों के बारे में जानेंगे।
सीएसएस के प्रकार |Types Of CSS In Hindi
Embedded या Internal CSS in Hindi
इस प्रकार के CSS को वेबपेज के head section में define किया जाता है। इसमें स्टाइल शीट के बीच <style> टैग का उपयोग करके स्टाइल डिफाइन किया जाता है। इसमें डिफाइन किए गए स्टाइल सभी वेबपेज के लिए लागू होते हैं। इस प्रकार का CSS कई वेबपेज्स के लिए इस्तेमाल किया जा सकता है।
विशेषताएं:
Embedded या Internal CSS In Hindi
- स्टाइल शीट को वेबपेज के head section में define किया जाता है।
- यह स्टाइल शीट वेबपेज के अंदर ही रहती है।
- स्टाइल शीट के अंदर <style> टैग का उपयोग किया जाता है।
- इस प्रकार के CSS को इस्तेमाल करने के लिए कोई अलग फ़ाइल की ज़रूरत नहीं होती है।
उदाहरण:
Embedded या Internal CSS का एक उदाहरण है। जब आप एक HTML फ़ाइल बनाते हैं, तो आप सीधे उसी फ़ाइल में CSS को एम्बेड कर सकते हैं। यह आपको अपनी वेबसाइट के सार्वजनिक चौथाई में CSS स्क्रिप्ट को लागू करने की अनुमति देता है।
उदाहरण के लिए, यदि आपके पास एक HTML फ़ाइल है जो आपकी वेबसाइट के लिए उपयोग करना चाहते हैं, तो आप निम्नलिखित तरीके से CSS को एम्बेड कर सकते हैं:
<head>
<title>मेरी वेबसाइट</title>
<style>
body {
background-color: lightblue;
}
h1 {
color: white;
text-align: center;
}
</style>
</head>
इस उदाहरण में, हमने एक स्टाइल ब्लॉक बनाया है जो वेबसाइट के बैकग्राउंड कलर और शीर्षक के लिए शैली निर्धारित करता है। इस तरह के एम्बेडेड सीएसएस उपयोग से आप अपनी वेबसाइट को अधिक सुंदर बना सकते हैं।
Inline CSS in Hindi
इस प्रकार के CSS को वेबपेज के HTML टैग के अंदर define किया जाता है। इसमें एक एलीमेंट के style attribute में स्टाइल डिफाइन किया जाता है। इस प्रकार के CSS सभी एलीमेंट के लिए लागू होते हैं जो उस एलीमेंट के साथ जुड़े होते है।
विशेषताएं:
Inline CSS in Hindi
- स्टाइल शीट को वेबपेज के HTML टैग के अंदर define किया जाता है।
- एक एलीमेंट के style attribute में स्टाइल डिफाइन किया जाता है।
- सभी एलीमेंट के लिए स्टाइल डिफाइन होता है जो उस एलीमेंट के साथ जुड़े होते हैं।
- इस प्रकार के CSS को इस्तेमाल करने से पहले हमें सभी एलीमेंट की जानकारी होनी चाहिए।
उदाहरण:
Inline CSS का उदाहरण निम्नलिखित है। इसमें आप सीधे HTML टैग के अंदर CSS स्टाइल को लिखते हैं। यह अन्य वेब पेज में स्टाइल शीट की जगह ले सकता है।
उदाहरण के लिए, यदि आपके पास एक HTML फ़ाइल है जो आपकी वेबसाइट के लिए उपयोग करना चाहते हैं, तो आप निम्नलिखित तरीके से इनलाइन CSS का उपयोग कर सकते हैं:
<h1 style="color: blue; font-size: 36px;">मेरा शीर्षक</h1>
इस उदाहरण में, हमने एक h1 टैग को लिया है जिसमें स्टाइल सेट करने के लिए “style” एट्रिब्यूट का उपयोग किया है। हमने शीर्षक के लिए रंग को नीले और फ़ॉन्ट का आकार 36 पिक्सेल बनाया है। इस तरह के इनलाइन सीएसएस का उपयोग सीधे एक टैग में स्टाइल निर्धारित करने के लिए किया जाता है।
External CSS In Hindi
इस प्रकार के CSS को अलग से फाइल के रूप में बनाकर वेबपेज में इस्तेमाल किया जाता है। इसमें एक स्टाइल शीट फाइल बनाकर उसका उपयोग करते हुए सभी वेबपेज्स के लिए स्टाइल डिफाइन किया जाता है। इस प्रकार के CSS को लागू करने के लिए <link> टैग का उपयोग किया जाता है।
विशेषताएं:
External CSS In Hindi
- स्टाइल शीट को अलग से फाइल के रूप में बनाकर वेबपेज में इस्तेमाल किया जाता है।
- एक स्टाइल शीट फाइल बनाकर उसका उपयोग करते हुए सभी वेबपेज्स के लिए स्टाइल डिफाइन किया जाता है।
- इस प्रकार के CSS को लागू करने के लिए <link> टैग का उपयोग किया जाता है।
- यह सबसे ज्यादा प्रचलित तरीका है जो बड़े वेबसाइट्स में इस्तेमाल किया जाता है।
उदाहरण:
यदि आप एक्सटर्नल सीएसएस का उपयोग करना चाहते हैं, तो आप एक वेब पेज के लिए एक सीएसएस फ़ाइल बना सकते हैं। उस फ़ाइल का नाम आप खुद चुन सकते हैं, लेकिन उसकी फ़ाइल एक्सटेंशन .css होनी चाहिए। उसके बाद, आप वेब पेज के HTML टैग के head सेक्शन में एक लिंक टैग जोड़ सकते हैं जो सीएसएस फ़ाइल का नाम और स्थान शामिल करता है।
इस तरह का एक्सटर्नल सीएसएस कोड उदाहरण निम्नलिखित है:
CSS फ़ाइल का नाम: style.css
CSS कोड:
body {
background-color: #f1f1f1;
}
h1 {
color: red;
margin-left: 40px;
}
p {
font-family: verdana;
font-size: 20px;
}
इस उदाहरण में, सीएसएस कोड एक सीएसएस फ़ाइल में लिखा गया है जिसका नाम style.css है। उस फ़ाइल में, बॉडी टैग के लिए पृष्ठभूमि रंग, h1 टैग के लिए रंग और मार्जिन तथा p टैग के लिए फ़ॉन्ट परिवर्तन निर्दिष्ट किए गए हैं।
वेब पेज के head सेक्शन में, लिंक टैग उपयोग करके इस सीएसएस फ़ाइल का नाम और स्थान शामिल किए जाते हैं।
कुछ और प्रकार के CSS हैं जो विशेष उद्देश्यों के लिए इस्तेमाल किए जाते हैं, जैसे:
- Print CSS: प्रिंट आउट के लिए स्टाइल डिफाइन किए जाने वाले CSS होते हैं।
- Responsive CSS: रेस्पांसिव डिज़ाइन को सपोर्ट करने वाले CSS होते हैं।
- Mobile CSS: मोबाइल डिवाइस के लिए अलग से CSS बनाया जाता है जो डेस्कटॉप वेबपेज से थोड़ा अलग होता है।
अब आप जानते हैं कि Types of CSS in Hindi क्या होते हैं। आपके लिए सही CSS का चयन करना वेबडिजाइनिंग में बहुत महत्वपूर्ण है। यह आपकी वेबसाइट के लोडिंग समय और प्रदर्शन पर बहुत असर डालता है। इसलिए हमेशा स्थानान्तरित CSS का उपयोग करने से बचें और इंटरनल CSS का उपयोग केवल छोटी वेबसाइट्स या पेज के लिए करें। लागू करने से पहले अपनी वेबसाइट की जरूरतों के अनुसार CSS का चयन करें। इसके अलावा, आप सीएसएस फ्रेमवर्क का उपयोग कर सकते हैं जो आपके वेबसाइट के लिए अनुकूल होते हैं।
सीएसएस के प्रकार वीडियो |Types Of CSS In Hindi Video
निष्कर्ष
अंत में, हमने देखा कि CSS क्या है और यह वेब पेज को कैसे बेहतर दिखा सकता है। हमने Types Of CSS In Hindi के बारे में भी देखा जैसे Embedded या Internal CSS, Inline CSS और External CSS। हर Types Of CSS In Hindi अपनी विशेषताओं और फायदों के साथ आता है।
अंततः, अगर आप वेब डिजाइनिंग या वेब डेवलपमेंट में रुचि रखते हैं तो आपको निश्चित रूप से CSS के बारे में अधिक जानकारी होनी चाहिए। इस लेख को पढ़ने के लिए धन्यवाद, उम्मीद है आपको यह लेख पसंद आया होगा। कृपया अपनी राय औरकमेंट हमारे साथ शेयर करें, और यदि आपके पास कोई सवाल है तो हमसे पूछने के लिए स्वतंत्र महसूस करें।
कंप्यूटर के बारे में और सीखे
