Bummer! This is just a preview. You need to be signed in with an account to view the entire instruction.
Well done!
You have completed (UPI) Chapter 11: How to use CSS transitions, transforms, animations, and filters!
You have completed (UPI) Chapter 11: How to use CSS transitions, transforms, animations, and filters!
Instruction
Additional Examples with Multiple Filters
You can also combine filters to apply multiple effects simultaneously:
css
/* Applying multiple filters */
.inverted:hover {
filter: brightness(120%) contrast(90%) grayscale(50%);
}
This example brightens the image by 20%, reduces contrast by 10%, and converts the image to 50% grayscale when hovered over.
To see the effects of each CSS filter method, let's apply the ten different filte...