বাটনে ডিজেবলড (নিষ্ক্রিয়) লুক দিতে CSS opacity প্রোপার্টি ব্যবহার করা হয়। অপাসিটি কম করলে বাটন ম্লান দেখায়, যা ব্যবহারকারীকে বোঝায় এটি ক্লিকযোগ্য নয়।
উদাহরণ
নিচের কোডটি চালিয়ে ডিজেবলড বাটন লুক তৈরি করার উদাহরণ দেখুন:
<!DOCTYPE html> <html>
<head>
<style>
.btn1 {
color: black;
text-align: center;
font-size: 15px;
}
.btn2 {
color: black;
text-align: center;
font-size: 15px;
opacity: 0.5;
}
</style>
</head>
<body>
<h2>Result</h2>
<p>Click below for result:</p>
<button class="btn1">Enabled</button>
<button class="btn2">Disabled</button>
</body>
</html>
ব্যাখ্যা: .btn2 ক্লাসে opacity: 0.5; সেট করা হয়েছে, যা বাটনকে ৫০% পারদর্শী করে দিয়েছে। এছাড়া বাস্তব ডিজেবল করার জন্য HTML-এ disabled অ্যাট্রিবিউটও যোগ করা উচিত।