How does CSS implement gray switching between images and original colors?

How does CSS implement gray switching between images and original colors?

How does CSS implement gray and primary color switching:
Suggestion: writing code as much as possible can effectively improve learning efficiency and depth.
Some websites have brilliant effects, that is, when you place your mouse over an image, the image may be dimmed and switched to the original color. The following describes how to achieve this effect.
Code example:

<! DOCTYPE html>  
The above code is very simple, that is, the filter Attribute Set hyperlink pseudo class is implemented together. Unfortunately, the filter attribute is only supported by IE.
 
The original address is: http://www.softwhy.com/forum.php? Mod = viewthread & tid = 4691.
 
For more information, see: http://www.softwhy.com/divcss/