কিভাবে CSS ব্যবহার করে একটি ইনপুট ক্ষেত্র নিষ্ক্রিয় করবেন?

Kibhabe Css Byabahara Kare Ekati Inaputa Ksetra Niskriya Karabena



ইনপুট ক্ষেত্রটি ফর্ম তৈরি করতে এবং ব্যবহারকারীর কাছ থেকে ইনপুট নিতে ব্যবহৃত হয়। ব্যবহারকারীরা ইনপুট টাইপ অনুযায়ী ইনপুট ক্ষেত্র পূরণ করতে পারেন। কিন্তু কখনও কখনও, আপনাকে যেকোনো পূর্বশর্ত পূরণ করতে ইনপুট ক্ষেত্র নিষ্ক্রিয় করতে হবে, যেমন একটি চেকবক্স নির্বাচন করা। সেই পরিস্থিতিতে, আপনাকে ইনপুট ক্ষেত্রটি নিষ্ক্রিয় করতে হবে।

এই নির্দেশিকায়, আমরা কিভাবে CSS ব্যবহার করে ইনপুট ক্ষেত্র নিষ্ক্রিয় করতে হয় সে সম্পর্কে একটি ধারণা লাভ করব। সুতরাং, চলুন শুরু করা যাক!

কিভাবে CSS ব্যবহার করে একটি ইনপুট ক্ষেত্র নিষ্ক্রিয় করবেন?

CSS-এ, ইভেন্টগুলি ব্যবহার করে অক্ষম করা হয় ' পয়েন্টার-ইভেন্ট 'সম্পত্তি। সুতরাং, প্রথমে, পয়েন্টার-ইভেন্ট সম্পত্তি সম্পর্কে জানুন।







'পয়েন্টার-ইভেন্ট' সিএসএস প্রপার্টি কি?

দ্য ' পয়েন্টার-ইভেন্ট ” HTML উপাদানগুলি কীভাবে স্পর্শ ইভেন্টে সাড়া দেয় বা আচরণ করে, যেমন ক্লিক বা ট্যাপ ইভেন্ট, সক্রিয় বা হোভার অবস্থা এবং কার্সার দৃশ্যমান কিনা তা নিয়ন্ত্রণ করে।



বাক্য গঠন
পয়েন্টার-ইভেন্টগুলির সিনট্যাক্স নিম্নরূপ দেওয়া হয়েছে:



পয়েন্টার-ইভেন্ট : স্বয়ংক্রিয় | কোনটি ;

উপরে উল্লিখিত সম্পত্তি দুটি মান নেয়, যেমন ' স্বয়ংক্রিয় ' এবং ' কোনটি ”:





  • স্বয়ংক্রিয়: এটি ডিফল্ট ইভেন্টগুলি সম্পাদন করতে ব্যবহৃত হয়।
  • কোনোটিই না ইভেন্ট নিষ্ক্রিয় করতে এটি ব্যবহার করা হয়।

প্রদত্ত উদাহরণের দিকে যান।

উদাহরণ 1: CSS ব্যবহার করে একটি ইনপুট ক্ষেত্র যোগ করা

এই উদাহরণে, প্রথমে, আমরা একটি div তৈরি করব এবং এটিতে একটি শিরোনাম এবং ইনপুট ক্ষেত্র যোগ করব। তারপর, ইনপুট টাইপ হিসাবে সেট করুন ' পাঠ্য 'এবং এর মান হিসাবে সেট করুন' আপনার নাম প্রবেশ করুন



এইচটিএমএল

< div >
< কেন্দ্র >
< h1 > একটি ইনপুট ক্ষেত্র নিষ্ক্রিয় করুন < / h1 >
< ইনপুট প্রকার = 'পাঠ্য' মান = 'আপনার নাম প্রবেশ করুন' >
< / কেন্দ্র >
< / div >

এর পরে, CSS-এ যান এবং div-এর পটভূমির রঙ সেট করে স্টাইল করুন “ rgb(184, 146, 99) 'এবং উচ্চতা' হিসাবে 150px

সিএসএস

div {
পটভূমি- রঙ : আরজিবি ( 184 , 146 , 99 ) ;
উচ্চতা : 150px;
}

উপরে বর্ণিত কোডের আউটপুট নীচে দেওয়া হল। এখানে, আমরা দেখতে পাচ্ছি যে আমাদের ইনপুট ক্ষেত্র বর্তমানে সক্রিয় এবং ব্যবহারকারীর কাছ থেকে ইনপুট গ্রহণ করছে:

এখন, পরবর্তী অংশে যান যেখানে আমরা “এর মান ব্যবহার করি পয়েন্টার-ইভেন্ট ' সম্পত্তি হিসাবে ' কোনটি

উদাহরণ 2: CSS ব্যবহার করে একটি ইনপুট ক্ষেত্র নিষ্ক্রিয় করা

আমরা এখন ব্যবহার করব ' ইনপুট HTML ফাইলে যোগ করা উপাদান অ্যাক্সেস করতে এবং পয়েন্টার-ইভেন্টের মান হিসেবে সেট করতে কোনটি ”:

ইনপুট {
পয়েন্টার-ইভেন্ট : কোনটি ;
}

একবার আপনি উপরে বর্ণিত সম্পত্তি বাস্তবায়ন করলে ' পয়েন্টার-ইভেন্ট ' সঙ্গে ' কোনটি ” মান, ইনপুট ক্ষেত্রের পাঠ্য অ-সম্পাদনাযোগ্য হবে যা নির্দেশ করে যে আমাদের ইনপুট ক্ষেত্র নিষ্ক্রিয় করা হয়েছে:

এটাই! আমরা CSS ব্যবহার করে ইনপুট ফিল্ড নিষ্ক্রিয় করার পদ্ধতি ব্যাখ্যা করেছি।

উপসংহার

একটি HTML এ একটি ইনপুট ক্ষেত্র নিষ্ক্রিয় করতে, ' পয়েন্টার-ইভেন্ট ” CSS এর প্রপার্টি ব্যবহার করা হয়। এটি করতে, একটি ইনপুট ক্ষেত্র যোগ করুন এবং পয়েন্টার-ইভেন্টের মান হিসাবে সেট করুন “ কোনটি ইনপুট ক্ষেত্র নিষ্ক্রিয় করতে। এই নির্দেশিকায়, আমরা CSS ব্যবহার করে একটি ইনপুট ক্ষেত্র নিষ্ক্রিয় করার পদ্ধতি ব্যাখ্যা করি এবং এর একটি উদাহরণ প্রদান করি।