ফাংশন opacity

ফাংশন opacity ব্যাকগ্রাউন্ড ইমেজের স্বচ্ছতা পরিবর্তন করতে দেয়। মান 100% বা 1 ইমেজটির তার আসনীয় স্বচ্ছতা রাখে। মান 0 বোঝায়, যে ইমেজটি সম্পূর্ণরূপে স্বচ্ছ হয়ে যাবে। এই পরিসরে অবস্থিত যেকোনো সংখ্যা ব্যাকগ্রাউন্ডের আংশিক স্বচ্ছতা নির্ধারণ করে। নেতিবাচক মান নির্ধারণ করা যায় না। ডিফল্টভাবে মান হল 1।

সিনট্যাক্স

সিলেক্টর {
	filter: opacity(সংখ্যা);
}

উদাহরণ

আসুন আমাদের ইমেজের স্বচ্ছতা 50% সেট করি:

<div id="elem"></div>

#elem {
	filter: opacity(50%);
	background: url("bg.png") center / cover no-repeat;
	width: 400px;
	height: 300px;
	border: 1px solid black;
}

উদাহরণ

এবং এখন স্বচ্ছতা 100% সেট করি:

<div id="elem"></div>

#elem {
	filter: opacity(100%);
	background: url("bg.png") center / cover no-repeat;
	width: 400px;
	height: 300px;
	border: 1px solid black;
}

উদাহরণ

এবং এখন ফাংশন opacity-এ মান 0 নির্ধারণ করি:

<div id="elem"></div>

#elem {
	filter: opacity(0);
	background: url("bg.png") center / cover no-repeat;
	width: 400px;
	height: 300px;
	border: 1px solid black;
}

আরও দেখুন

ফাংশন blur,
যা ব্যাকগ্রাউন্ডকে ব্লার করে
ফাংশন brightness,
যা ব্যাকগ্রাউন্ডের উজ্জ্বলতা নির্ধারণ করে
ফাংশন contrast,
যা ব্যাকগ্রাউন্ডের কনট্রাস্ট নির্ধারণ করে
ফাংশন drop-shadow,
যা ব্যাকগ্রাউন্ডে ছায়া নির্ধারণ করে
ফাংশন hue-rotate,
যা ব্যাকগ্রাউন্ডের হিউ নির্ধারণ করে
ফাংশন invert,
যা ব্যাকগ্রাউন্ডের কালার ইনভার্ট করে
ফাংশন sepia,
যা ব্যাকগ্রাউন্ডকে সেপিয়াতে রূপান্তরিত করে
প্রপার্টি background,
যা ব্যাকগ্রাউন্ডের জন্য একটি শর্টহ্যান্ড প্রপার্টি
প্রপার্টি background-image,
যার সাহায্যে একটি ব্লকে ব্যাকগ্রাউন্ড ইমেজ নির্ধারণ করা যায়