CSS कमेंट्स
अब तक आप नियम लिखना और स्टाइलशीट जोड़ना सीख चुके हैं। कई बार कोड के पास अपने लिए एक छोटा-सा नोट छोड़ने की ज़रूरत पड़ती है, या टेस्ट करते समय किसी स्टाइल को बिना मिटाए कुछ देर के लिए बंद करना होता है। CSS कमेंट्स यही काम करते हैं।
CSS कमेंट क्या है?
CSS कमेंट एक नोट होता है, जिसे /* और */ के बीच लिखा जाता है। स्टाइल लागू करते समय ब्राउज़र इसे पूरी तरह छोड़ देता है। इसका उपयोग छोटी याददाश्त के लिए, स्टाइलशीट के हिस्सों के शीर्षक देने के लिए, या प्रयोग करते समय किसी नियम को अस्थायी रूप से बंद करने के लिए करें।
कमेंट कैसे लिखें
कमेंट इस तरह लिखा जाता है: /* आपका नोट यहाँ */। शुरुआती /* से लेकर अंत के */ तक जो कुछ भी है, उसे CSS इंजन अनदेखा कर देता है। विज़िटर को कमेंट पेज के टेक्स्ट के रूप में नहीं दिखते; वे सिर्फ़ स्टाइलशीट के सोर्स में रहते हैं (और फ़ाइल खोलने पर DevTools में भी दिखते हैं)।
एक पंक्ति का कमेंट
css/* Brand teal for the hero heading */
.hero {
color: #0f766e;
}छोटे नोट ही काफ़ी क्यों हैं
नियम के ऊपर एक पंक्ति का कमेंट बता सकता है कि कोई मान क्यों रखा गया है, जैसे ब्रांड का रंग, अस्थायी सुधार या एक्सेसिबिलिटी की वजह से लिया गया फ़ैसला। निबंध की जगह छोटा नोट लिखें; कुछ हफ़्ते बाद आपको याद दिलाने के लिए बस एक इशारा चाहिए होगा।
कई पंक्तियों वाले कमेंट
कमेंट कई पंक्तियों में फैल सकता है। आम तरीक़ा यह है कि संबंधित नियमों के समूह से पहले एक छोटा-सा "सेक्शन बैनर" लगा दिया जाए, ताकि लंबी स्टाइलशीट में भी चीज़ें आसानी से मिल जाएँ।
कई पंक्तियों वाला सेक्शन कमेंट
css/*
Header styles
Keep logo and nav colors here
*/
.site-header {
background: #0f172a;
color: #f8fafc;
}बहु-पंक्ति कमेंट छोटे रखें। फ़ाइल के बीच में पूरे-पूरे अनुच्छेद लिख देने से फ़ाइल पढ़ना कमेंट न होने से भी ज़्यादा कठिन हो जाता है।
किसी नियम को अस्थायी रूप से बंद करना
आप एक declaration या पूरे नियम को कमेंट में रखकर उसे बिना हटाए बंद कर सकते हैं। बाद में कमेंट के चिह्न हटा दें, स्टाइल वापस आ जाएगी। जब आप ढूँढ रहे हों कि कौन-सी property लेआउट बिगाड़ रही है, तब यह तरीका बहुत काम आता है।
एक declaration को कमेंट करना
css.hero {
color: #0f766e;
/* font-size: 2rem; */
font-family: Georgia, serif;
}टेस्ट करने की अच्छी आदत
हमेशा सबसे छोटा हिस्सा कमेंट करें जिससे आपको कुछ समझ आए; पहले सिर्फ़ एक declaration। अगर पेज फिर से ठीक दिखने लगे, तो गड़बड़ी की जड़ मिल गई। इसके बाद या तो मान सुधारें या बेकार कोड हटा दें। तैयार स्टाइलशीट में बंद किए हुए बड़े-बड़े ब्लॉक हमेशा के लिए न छोड़ें।
HTML कमेंट से अलग
HTML कमेंट <!-- से शुरू होकर --> पर ख़त्म होते हैं, जबकि CSS कमेंट /* और */ का उपयोग करते हैं। HTML कमेंट के चिह्न .css फ़ाइल में न चिपकाएँ (और <style> ब्लॉक में भी नहीं, क्योंकि वहाँ CSS का सिंटैक्स चलता है)। हर भाषा के कमेंट लिखने का अपना तरीका है। अगर आपने पहले HTML कमेंट सीखे हैं, तो इसे उसी जैसा एक अलग कौशल समझें, जिसके चिह्न अलग हैं।
कमेंट सुरक्षित जगह नहीं हैं
जो भी स्टाइलशीट खोल सकता है (या View Source / Network टैब देख सकता है), वह आपके कमेंट पढ़ सकता है। CSS कमेंट में कभी पासवर्ड, निजी कुंजी या गुप्त टोकन न लिखें। कमेंट डेवलपमेंट के नोट्स के लिए हैं, संवेदनशील डेटा छिपाने के लिए नहीं।
खुद आज़माएँ
- एक अभ्यास स्टाइलशीट (या
<style>ब्लॉक) खोलें, जिसमें.heroनियमcolorऔरfont-sizeसेट करता हो। - नियम के ऊपर एक पंक्ति का कमेंट लिखें जो रंग चुनने का कारण बताए।
font-sizeवाले declaration को/* … */में रखें, सेव करें और पेज रिफ़्रेश करें; आकार डिफ़ॉल्ट पर लौट आएगा, जबकि रंग पहले की तरह लागू रहेगा।font-sizeके आसपास से कमेंट के चिह्न हटाएँ और दोबारा रिफ़्रेश करें, स्टाइल वापस आ जाएगी।- वैकल्पिक: नियमों के समूह के ऊपर एक छोटा बहु-पंक्ति सेक्शन कमेंट जोड़ें।
आम गलतियाँ
- CSS में HTML के चिह्न (
<!-- -->) इस्तेमाल करना; CSS इंजन उन्हें कमेंट नहीं मानता - अंत का
*/भूल जाना, जिससे स्टाइलशीट का बाकी हिस्सा अनदेखा हो जाता है - कमेंट के अंदर कमेंट रखने की कोशिश (
/* outer /* inner */ still broken */); CSS कमेंट सही ढंग से नेस्ट नहीं होते - प्रोडक्शन फ़ाइलों में महीनों तक कमेंट किए हुए नियमों का ढेर छोड़ देना
- कमेंट में गुप्त जानकारी या निजी URL लिख देना
सारांश
- CSS कमेंट
/*और*/के बीच लिखे जाते हैं - स्टाइल लागू करते समय ब्राउज़र कमेंट का टेक्स्ट अनदेखा करता है
- छोटे नोट, सेक्शन के शीर्षक, या टेस्टिंग के दौरान अस्थायी रूप से बंद करने के लिए इनका उपयोग करें
- HTML कमेंट
<!-- -->से लिखे जाते हैं; इस सिंटैक्स को CSS में न मिलाएँ - कमेंट सोर्स में दिखते हैं; वहाँ कभी कोई गोपनीय चीज़ न रखें
🧠 अपने ज्ञान की परीक्षा करें
अपने ज्ञान की परीक्षा करें
इस इंटरैक्टिव क्विज़ के साथ अपनी चुनौती लें और देखें कि आप विषय को कितनी अच्छी तरह समझते हैं
📝 निर्देश
- हर प्रश्न को ध्यान से पढ़ें
- हर प्रश्न के लिए सबसे अच्छा उत्तर चुनें
- आप जितनी बार चाहें क्विज़ दोबारा दे सकते हैं
- आपकी प्रगति शीर्ष पर दिखाई जाएगी