When it comes to CSS shadow effects, you will definitely think of box shadow.
But if you use it to add a shadow to a transparent image, it looks like a border has been added to the image
<img style="box shadow: 2px 4px 8px # 3723a1" src="logo. png" alt="Lao Li next door">
In this case, we need to use filter: drop shadow.
Although drop shadow is not as simple and crude as box shadow, its working mode is to follow the alpha channel of the image. It is said that the shadow generated by drop shadow is based on the internal shape (opaque part) of the image, rather than displayed outside the image, which is impossible for box shadow to achieve
The effect is like this
<img style="filter: drop shadow (2px 4px 8px # 3723a1)" src="logo. png" alt="Lao Li next door">
Drop shadow compatibility
