CSS හි opacity ගුණය හරහා අර්ධ විනිවිද පෙනෙන ස්වභාවය
මූලද්රව්යයක අර්ධ විනිවිද පෙනෙන ස්වභාවය
opacity ගුණය හරහා ද නියම කළ හැක.
මෙම ගුණය 0 සිට 1 දක්වා භාගික
මූල්යයන් ද සලකා බලයි. මෙහිදී අර්ධ විනිවිද
පෙනෙන ස්වභාවය මූලද්රව්යයටම එකවර
නියම වේ: එහි පාඨය, පසුබිම සහ මායිමට.
උදාහරණය බලන්න:
<div id="parent">
<div id="elem">
Lorem ipsum dolor sit amet.
</div>
</div>
#parent {
background-image: url("bg.png");
background-repeat: no-repeat;
background-size: cover;
display: inline-block;
padding: 30px;
}
#elem {
width: 300px;
height: 200px;
padding: 10px;
font-size: 50px;
font-weight: bold;
border: 20px solid red;
background: black;
color: red;
opacity: 0.7;
}
:
ඔබට යම් පසුබිම් පින්තූරයක් ඇති යැයි සිතමු.
එහි මත පාඨය, මායිම සහ පසුබිම සහිත බ්ලොක් දෙකක්
තබන්න. මෙම බ්ලොක් වල මත opacity හරහා අර්ධ
විනිවිද පෙනෙන ස්වභාවය සහ rgba හරහා අර්ධ
විනිවිද පෙනෙන ස්වභාවය අතර වෙනස නිරූපණය කරන්න.
