इस गाइड में, हम समझेंगे कि CSS का उपयोग करके इनपुट फ़ील्ड को कैसे निष्क्रिय किया जाए। तो, चलिए शुरू करते हैं!
CSS का उपयोग करके इनपुट फ़ील्ड को अक्षम कैसे करें?
CSS में, इवेंट्स को “का उपयोग करके अक्षम किया जाता है” सूचक घटना ' संपत्ति। तो, सबसे पहले, पॉइंटर-इवेंट्स प्रॉपर्टी के बारे में जानें।
'सूचक-घटनाएँ' CSS संपत्ति क्या है?
' सूचक घटना ' नियंत्रित करें कि HTML तत्व टच इवेंट पर कैसे प्रतिक्रिया करते हैं या व्यवहार करते हैं, जैसे कि क्लिक या टैप ईवेंट, सक्रिय या होवर स्थिति, और कर्सर दिखाई दे रहा है या नहीं।
वाक्य - विन्यास
पॉइंटर-इवेंट्स का सिंटैक्स निम्नानुसार दिया गया है:
सूचक घटना : ऑटो | कोई भी नहीं ;
उपरोक्त उल्लिखित संपत्ति दो मान लेती है, जैसे ' ऑटो ' तथा ' कोई भी नहीं ':
- ऑटो: इसका उपयोग डिफ़ॉल्ट घटनाओं को करने के लिए किया जाता है।
- कोई भी नहीं: इसका उपयोग घटनाओं को अक्षम करने के लिए किया जाता है।
दिए गए उदाहरण की ओर चलें।
उदाहरण 1: CSS का उपयोग करके एक इनपुट फ़ील्ड जोड़ना
इस उदाहरण में, सबसे पहले, हम एक डिव बनाएंगे और उसमें एक हेडिंग और इनपुट फील्ड जोड़ेंगे। फिर, इनपुट प्रकार को 'के रूप में सेट करें मूलपाठ 'और इसके मान को' के रूप में सेट करें अपना नाम दर्ज करें '
एचटीएमएल
< डिव >< केंद्र >
< एच 1 > एक इनपुट फ़ील्ड अक्षम करें < / एच 1 >
< इनपुट प्रकार = 'मूलपाठ' मूल्य = 'अपना नाम दर्ज करें' >
< / केंद्र >
< / डिव >
उसके बाद, CSS पर जाएँ और डिव को इसके बैकग्राउंड कलर को “के रूप में सेट करके स्टाइल करें” आरजीबी(184, 146, 99) 'और ऊंचाई' के रूप में 150पीएक्स '
सीएसएस
डिव {पार्श्वभूमि- रंग : आरजीबी ( 184 , 146 , 99 ) ;
कद : 150पीएक्स;
}
ऊपर वर्णित कोड का आउटपुट नीचे दिया गया है। यहां, हम देख सकते हैं कि हमारा इनपुट फ़ील्ड वर्तमान में सक्रिय है और उपयोगकर्ता से इनपुट स्वीकार कर रहा है:
अब, अगले भाग पर जाएँ जिसमें हम “के मान का उपयोग करते हैं” सूचक घटना 'संपत्ति के रूप में' कोई भी नहीं '
उदाहरण 2: CSS का उपयोग करके इनपुट फ़ील्ड को अक्षम करना
अब हम उपयोग करेंगे ' इनपुट HTML फ़ाइल में जोड़े गए <इनपुट> तत्व तक पहुँचने के लिए और पॉइंटर-ईवेंट के मान को 'के रूप में सेट करें' कोई भी नहीं ':
इनपुट {सूचक घटना : कोई भी नहीं ;
}
एक बार जब आप ऊपर बताई गई संपत्ति को लागू कर देते हैं ' सूचक घटना ' साथ ' कोई भी नहीं 'मान, इनपुट फ़ील्ड का टेक्स्ट गैर-संपादन योग्य होगा जो इंगित करता है कि हमारा इनपुट फ़ील्ड अक्षम है:
इतना ही! हमने CSS का उपयोग करके इनपुट फ़ील्ड को अक्षम करने की विधि के बारे में बताया है।
निष्कर्ष
HTML में इनपुट फ़ील्ड को अक्षम करने के लिए, ' सूचक घटना 'सीएसएस की संपत्ति का उपयोग किया जाता है। ऐसा करने के लिए, एक इनपुट फ़ील्ड जोड़ें, और पॉइंटर-ईवेंट का मान 'के रूप में सेट करें' कोई भी नहीं 'इनपुट फ़ील्ड को अक्षम करने के लिए। इस गाइड में, हम CSS का उपयोग करके इनपुट फ़ील्ड को अक्षम करने की विधि की व्याख्या करते हैं और इसका एक उदाहरण प्रदान करते हैं।