contrast ක්‍රියාකාරිත්වය
contrast ක්‍රියාකාරිත්වය වර්ණයක විරුද්ධත්වය සකස් කිරීම සඳහා භාවිතා කරයි.
එය වර්ණයේ ආලෝකමත්ම සහ අඳුරුම කොටස් අතර වෙනස වැඩි කරයි හෝ අඩු කරයි,
එය වඩාත් ප්‍රකාශනශීලී හෝ අනෙක් අතට, වඩාත් මෘදු කරයි.
100% අගය වර්ණය නොවෙනස්ව තබයි.
100% ට වඩා අඩු අගයන් විරුද්ධත්වය අඩු කරයි, 100% ට වඩා වැඩි අගයන් - වැඩි කරයි.
0% අගය සම්පූර්ණයෙන්ම අළු වර්ණයක් නිර්මාණය කරයි.
වාක්‍ය රචනය
contrast(amount)
උදාහරණය
නිල් වර්ණය සඳහා විවිධ විරුද්ධත්ව මට්ටම්:
<div class="box contrast-50">50% contrast</div>
<div class="box contrast-100">100% contrast</div>
<div class="box contrast-150">150% contrast</div>
<div class="box contrast-200">200% contrast</div>
.box {
width: 100px;
height: 100px;
margin: 10px;
display: inline-block;
color: white;
text-align: center;
line-height: 100px;
}
.contrast-50 {
background: contrast(#3498db, 50%);
}
.contrast-100 {
background: contrast(#3498db, 100%);
}
.contrast-150 {
background: contrast(#3498db, 150%);
}
.contrast-200 {
background: contrast(#3498db, 200%);
}
:
මෙයත් බලන්න
-
brightnessක්‍රියාකාරිත්වය,
වර්ණයක දීප්තිය සකස් කරයි -
invertක්‍රියාකාරිත්වය,
වර්ණ ආපසු හරවයි
