The opacity Function
The opacity function sets the opacity of an image to change its transparency.
0% opacity creates a completely transparent image, whereas 100% is the original image.
The brightness Function
The brightness(amount) function adjusts the brightness of an image, making it appear brighter or darker.
The amount parameter determines the brightness level of the image. The parameter can take either a percentage value or a number.
A value of 0% results in an image that is completely black.
A value of 100% results in an image that is unchanged.
Any amount over 100% produces a brighter image.
Here is an example using a percentage value to make the image darker:
A number value of 0.5 has the same effect as the percentage value of 50%. A value of 1 is the same as 100%.
Here is an example using a number value to make the image brighter:
The contrast Function
The contrast function adjusts the contrast of the image.
The amount parameter can take either a percentage value or a number.
A value under 100% decreases the contrast, while a value over 100% increases it.
A value of 0% will create an image that is completely gray, while a value of 100% leaves the image unchanged.
The value 0.5 corresponds to 50%, while 1 is the same as 100%.
Here is an example using a percentage value to give the image more contrast:
The blur Function
The blur function applies a blur effect to an image.
The blur function has only one parameter, radius, which defines how many pixels on the screen blend into each other. (a larger value creates more blur).
If no parameter is provided, then the default value 0 is used, which leaves the image unchanged.
/* Both have no effect on the picture*/
blur(); /* If no parameter is provided, then a value 0 is used.*/
blur(0); /* A value of 0 leaves the input unchanged.*/
CLICK ON THE BUTTON BELOW TO GO TO THE CSS MAIN COURSE PAGE.
© License: All Rights Reserved
CONTACT HOLLA TECH – LEARN SUPPORT