Filter v/s Backdrop-filter :- CSS

 The main difference between a filter and a backdrop filter is that the filter will affect the element itself, and the backdrop filter will affect the elements beneath the element within the bounding box of the element.

A sample difference with Blur() :

A normal set of content over an image.
Filter:blur(2px)
filter:blur(2px) added to its content DIV
backdrop-filter:blur(40px)
backdrop-filter(40px) added to its content DIV

So, if you want a blur effect on an image, you have to give the CSS style to that image. Then you have to overlay contents separately.

Leave a comment

Your email address will not be published. Required fields are marked *