ఈ గైడ్‌లో, CSSని ఉపయోగించి ఇన్పుట్ ఫీల్డ్‌ను ఎలా డిసేబుల్ చేయాలో మేము అర్థం చేసుకుంటాము. కాబట్టి, ప్రారంభిద్దాం!
CSSని ఉపయోగించి ఇన్పుట్ ఫీల్డ్‌ని ఎలా డిసేబుల్ చేయాలి?
CSSలో, “ని ఉపయోగించడం ద్వారా ఈవెంట్‌లు నిలిపివేయబడతాయి పాయింటర్-సంఘటనలు ”ఆస్తి. కాబట్టి, ముందుగా, పాయింటర్-ఈవెంట్స్ ప్రాపర్టీ గురించి తెలుసుకోండి.
“పాయింటర్ ఈవెంట్స్” CSS ప్రాపర్టీ అంటే ఏమిటి?
ది ' పాయింటర్-సంఘటనలు ” టచ్ ఈవెంట్‌కి HTML ఎలిమెంట్‌లు ఎలా స్పందిస్తాయో లేదా ఎలా ప్రవర్తిస్తాయో, అంటే క్లిక్ లేదా ట్యాప్ ఈవెంట్‌లు, యాక్టివ్ లేదా హోవర్ స్టేట్‌లు మరియు కర్సర్ కనిపిస్తుందా లేదా అనేది నియంత్రించండి.
వాక్యనిర్మాణం
పాయింటర్ ఈవెంట్‌ల వాక్యనిర్మాణం క్రింది విధంగా ఇవ్వబడింది:
పాయింటర్-సంఘటనలు : దానంతట అదే | ఏదీ లేదు ;
పైన పేర్కొన్న ఆస్తి రెండు విలువలను తీసుకుంటుంది, ఉదాహరణకు ' దానంతట అదే 'మరియు' ఏదీ లేదు ”:
- దానంతట అదే: ఇది డిఫాల్ట్ ఈవెంట్‌లను నిర్వహించడానికి ఉపయోగించబడుతుంది.
- ఏదీ లేదు: ఇది ఈవెంట్‌లను నిలిపివేయడానికి ఉపయోగించబడుతుంది.
ఇచ్చిన ఉదాహరణ వైపు వెళ్ళండి.
ఉదాహరణ 1: CSSని ఉపయోగించి ఇన్పుట్ ఫీల్డ్‌ని జోడించడం
ఈ ఉదాహరణలో, ముందుగా, మేము ఒక divని సృష్టిస్తాము మరియు దానికి హెడ్డింగ్ మరియు ఇన్పుట్ ఫీల్డ్‌ను జోడిస్తాము. ఆపై, ఇన్పుట్ రకాన్ని “”గా సెట్ చేయండి వచనం 'మరియు దాని విలువను' గా సెట్ చేయండి మీ పేరు రాయుము, మీ పేరు రాయండి ”.
HTML
< div >< కేంద్రం >
< h1 > ఇన్పుట్ ఫీల్డ్‌ను నిలిపివేయండి < / h1 >
< ఇన్పుట్ రకం = 'వచనం' విలువ = 'మీ పేరు రాయుము, మీ పేరు రాయండి' >
< / కేంద్రం >
< / div >
ఆ తర్వాత, CSSకి తరలించి, దాని నేపథ్య రంగును “గా సెట్ చేయడం ద్వారా divని స్టైల్ చేయండి. rgb(184, 146, 99) 'మరియు ఎత్తు' 150px ”.
CSS
div {నేపథ్య- రంగు : rgb ( 184 , 146 , 99 ) ;
ఎత్తు : 150px;
}
పైన వివరించిన కోడ్ యొక్క అవుట్‌పుట్ క్రింద ఇవ్వబడింది. ఇక్కడ, మన ఇన్పుట్ ఫీల్డ్ ప్రస్తుతం సక్రియంగా ఉందని మరియు వినియోగదారు నుండి ఇన్‌పుట్‌ను అంగీకరిస్తున్నట్లు మనం చూడవచ్చు:
ఇప్పుడు, '' విలువను ఉపయోగించే తదుపరి భాగానికి వెళ్లండి పాయింటర్-సంఘటనలు 'ఆస్తి' ఏదీ లేదు ”.
ఉదాహరణ 2: CSSని ఉపయోగించి ఇన్పుట్ ఫీల్డ్‌ని నిలిపివేయడం
మేము ఇప్పుడు ఉపయోగిస్తాము ' ఇన్పుట్ ” HTML ఫైల్‌లో జోడించిన మూలకాన్ని యాక్సెస్ చేయడానికి మరియు పాయింటర్-ఈవెంట్‌ల విలువను “గా సెట్ చేయండి ఏదీ లేదు ”:
ఇన్పుట్ {పాయింటర్-సంఘటనలు : ఏదీ లేదు ;
}
మీరు పైన పేర్కొన్న ఆస్తిని అమలు చేసిన తర్వాత ' పాయింటర్-సంఘటనలు 'తో' ఏదీ లేదు ” విలువ, ఇన్పుట్ ఫీల్డ్ యొక్క వచనం సవరించబడదు, ఇది మా ఇన్పుట్ ఫీల్డ్ నిలిపివేయబడిందని సూచిస్తుంది:
అంతే! CSSని ఉపయోగించి ఇన్పుట్ ఫీల్డ్‌ని డిసేబుల్ చేసే పద్ధతిని మేము వివరించాము.
ముగింపు
HTMLలో ఇన్పుట్ ఫీల్డ్‌ని నిలిపివేయడానికి, ' పాయింటర్-సంఘటనలు ” CSS యొక్క ఆస్తి ఉపయోగించబడుతుంది. అలా చేయడానికి, ఇన్పుట్ ఫీల్డ్‌ని జోడించి, పాయింటర్-ఈవెంట్‌ల విలువను ఇలా సెట్ చేయండి ఏదీ లేదు ”ఇన్పుట్ ఫీల్డ్‌ను నిలిపివేయడానికి. ఈ గైడ్‌లో, మేము CSSని ఉపయోగించి ఇన్పుట్ ఫీల్డ్‌ని డిసేబుల్ చేసే పద్ధతిని వివరిస్తాము మరియు దానికి ఉదాహరణను అందిస్తాము.