To specify the clarity of the image or the transparency of an element, CSS Opacity is used.
To apply the CSS opacity setting:
The setting of the CSS opacity is implemented uniformly over the whole object. It is not inherited. Defined in terms of digital value less than 1, the greater opacity value renders lesser opacity.
Example: Image transparency:
<!DOCTYPE html>
<html>
<head>
<style>
img {
opacity: 0.4;
filter: alpha(opacity=40);
}
</style>
</head>
<body>
<h1>Example:</h1>
<p>Image with 40% opacity.</p>
<img src="img.jpg" alt="Sky" width="200" height="200">
</body>
</html>
Explanation:
In the above example, we are defining image transparency using CSS Opacity.