What is CSS in Hindi

What is CSS in Hindi :- हेल्लो दोस्तों आज हम सीखेंगे की CSS क्या है? CSS की फुल फॉर्म क्या होती है? CSS स्टाइल कितने प्रकार की होती है। CSS के बारे में ऐसे सभी सवालों के जवाब और कई सारी अन्य जानकारी आज आपको यहाँ मिलने वाली है। उम्मीद है ये जानकारियाँ आपके काम आएँगी।

CSS एक language हैं जिससे हम किसी HTML Document को एक आकर्षक रूप दे सकते हैं। जैसा की हमने अपने पिछले आर्टिकल ( What is HTML in Hindi ) में जाना की HTML क्या होती हैं और यह क्या काम आती है जहाँ HTML से हम किसी वेबपेज को आकार देते हैं, वहीं CSS से हम उस पेज को एक आकर्षक रूप देते हैं। HTML की तरह CSS को लिखने के लिए भी हमें एक text editor (जैसे Notepad, Sublime, Visual Code Studio etc.) की जरूरत होती हैं और वेबपेज में जो बदलाव किये जाते हैं वो बेब ब्राउजर पर दिखते हैं।

CSS का पूरा नाम Cascading Style Sheet होता है इसे सन 1996 में W3C द्वारा विकसित किया गया था। जिसका उपयोग मार्कअप भाषा में लिखे डॉक्यूमेंट को सुंदर बनाने के लिए किया जाता है, जिसमें लेआउट,रंग और फोंट आदि सम्मिलित हैं। CSS का उपयोग XML, SVG, और XUL सहित किसी भी प्रकार के एक्सएमएल डाक्यूमेंट्स (XML Documents) के साथ भी किया जा सकता है।

CSS स्टाइल के प्रकार ( Types of CSS )

Inline Styles Sheet

नीचे दिए गए उदाहरण में हम देख सकते है, बॉडी टैग में, स्टाइल एट्रिब्यूट डिफाइन किया गया है। इसके बाद, स्टाइल एट्रिब्यूट में प्रॉपर्टी और वैल्यू डिफाइन किया गया है। इसे इनलाइन स्टाइल शीट कहा जाता है।

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Inline CSS Demo</title>
</head>
<body style="background-color: green;">
    <h1>This is Inline CSS Demo</h1>
</body>
</html>

प्रॉपर्टी	background-color:
वैल्यू	green

Internal Style Sheet

नीचे दिए गए उदाहरण में हम देख सकते है इंटरनल स्टाइल शीट में <style> टैग को हेड सेक्शन में डिफाइन किया जाता है। इसके बाद, सिलेक्टर्स (Selectors) का उपयोग करके, हम स्टाइल्स को डिफाइन करते हैं। इसमें एचटीएमएल और सीएसएस कोड को एक ही डॉक्यूमेंट में डिफाइन किया जाता है। इसे Internal Style Sheet कहा जाता है

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Internal Style Sheet</title>
    <style>h1 { color:red; }</style>
</head>
<body>
    <h1>This is Internal Style Sheet</h1>
</body>
</html>

जैसा की हमने ऊपर पढ़ा Inline Styles Sheet और Internal Style Sheet क्या होती है अब हम जानेंगे External Style Sheet के बारे में तो चलिए शुरू करते है

External Style Sheet

External Style Sheet में जैसा की नाम से ही पता चल रहा इसमें किसी External फाइल का उपयोग होगा External Style Sheet के संदर्भ में सीएसएस कोड को किसी अन्य फाइल में लिखा जाता है और उसके साथ ही हमें इसे HTML फाइल के हेड टैग में लिंक करना होता है। जैसा की हमने अपने पिछले आर्टिकल (What is HTML in Hindi) में जाना के किसी HTML फाइल को .html extension के साथ save किया जाता है उसी प्रकार हमें CSS फाइल को .css extension के साथ save करना होता है इसे External Style Sheet कहा जाता है

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Internal Style Sheet</title>
    <link rel="stylesheet" href="css/style.css">
</head>
<body>
    <h1>This is Internal Style Sheet</h1>
</body>
</html>

href=””

ब्रैकेट्स के अंदर हमें अपने css फाइल का path ( location ) देना होता है ( ऊपर दिए गए example में CSS एक फोल्डर का नाम है तथा style.css फाइल का नाम है )

External style.css demo

body { background-color: green; }
h1 { color:red; }

CSS की विशेषताएं (Features of CSS in Hindi)

Pages Load Faster

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

CSS Saves lots of time

CSS का सबसे बड़ी खासियत यह है कि CSS का उपयोग करके हम बहुत समय बचा सकते हैं। क्योकि हम एक ही सीएसएस फ़ाइल का उपयोग कई HTML पृष्ठों पर कर सकते हैं।

Easy Maintenance

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

Animations and Transitions

CSS में Animations and Transitions का उपयोग करके हम अपने वेबसाइट को और भी आकर्षित बना सकते है

हमें उम्मीद है की आपको यह आर्टिकल ( What is CSS in Hindi ) पसंद आया होगा। इस बारे में आप अपने विचार निचे कमेंट में जरुर रखें और इस article को अपने दोस्तों के साथ शेयर जरुर करें।