কম্পিউটার টিউটোরিয়াল

RGBA ব্যবহার করে CSS ট্রান্সপারেন্সি


CSS ট্রান্সপারেন্সির জন্য RGBA() মান ব্যবহার করুন। রঙের অপাসিটি নির্দিষ্ট করতে আলফা চ্যানেল প্যারামিটার সেট করুন।

উদাহরণ

নিচের কোডটি RGBA ব্যবহার করে CSS ট্রান্সপারেন্সি বাস্তবায়ন করার পদ্ধতি দেখায়:

<!DOCTYPE html>
<html>
<head>
<style>
body {
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}
div {
    width: 200px;
    height: 200px;
    background-color: rgb(0, 0, 255);
    color: white;
    display: inline-block;
}
.transparent {
    background-color: rgba(0, 0, 255, 0.582);
}
</style>
</head>
<body>
<h1>Transparency using RGBA example</h1>
<div class="transparent"> Lorem ipsum dolor sit amet consectetur adipisicing elit. Hic, accusantium. </div>
<div> Lorem ipsum dolor sit amet consectetur adipisicing elit. Eum, nisi! </div>
</body>
</html>

আউটপুট

উপরোক্ত কোড নিচের আউটপুটটি তৈরি করবে:

RGBA ব্যবহার করে CSS ট্রান্সপারেন্সি


  1. CSS দিয়ে ব্যাকগ্রাউন্ড রিপিট (Background Repeat) ব্যবহার করা

  2. CSS text-decoration দিয়ে টেক্সট সাজানো: আন্ডারলাইন, ওভারলাইন, লাইন-থ্রু

  3. CSS অপাসিটি / ট্রান্সপারেন্সি

  4. CSS-এ Data-Attributes (data-*) ব্যবহার করা